jQuery selector background-image

Question

Is there a way to identify the selector is by the spesific background-image. Is there a way to do this?

<ul style="background-image:url(/test/test/shortcutsMenu-test.png);">

I know this is not the right way to do it, but I'm manipulating a website to a mobile version of the same site.

Answer 1

You could use filter:

$("ul").filter(function() {
    return $(this).css("background-image") === "url(/test/test/shortcutsMenu-test.png)"; 
});

This will allow you to select ul elements that have a background image defined elsewhere, not only inline. Here's a working example.

If you don't care about that, and the background image will always be applied inline in a style attribute, you could use an "attribute contains" selector with the style attribute.

Update (based on comments)

To just search for part of the file name you can use normal JavaScript string methods like indexOf (since the jQuery css method returns a string):

$("ul").filter(function() {
    return $(this).css("background-image").indexOf("findThisString") > -1; 
});

Answer 2

one way of doing it is:

$('ul[style*="/test/test/shortcutsMenu-test.png"]')

JSFiddle example here