check if any element contains certain css style

Question

I am wondering to find out the checking process for an element to contain any css style.

I do have below html code:

<ul id="sample">
    <li style="left:-100px">text 1</li>
    <li style="left:0px">text 2</li>
    <li style="left:100px">text 3</li>
</ul>

I want to find out the "li" whose style left is 0px and then want to apply any more style to that li.

Thanks

Answer 1

$('ul#sample li').each(function(){
    if($(this).css('left') == '0'){
        $(this).css('background','red');
    }
});

Example: http://jsfiddle.net/jasongennaro/dnqf8/3/

You could also do this with plain JS.

var a = document.getElementsByTagName('li');

for(var i = 0; i < a.length; i++){
    if(a[i].style.left == '0px'){
        a[i].style.background = 'red';
    }
}

Example 2: http://jsfiddle.net/jasongennaro/dnqf8/2/