Question

I’m trying to select based on a css attribute (in my case top).

HTML:

<i style="top:1px;">1px</i><br/>

JS:

$('i').each(function() {
    var top = $(this).css('top');
    console.log('top = '+top);
    if(top == '1px') j(this).css('border','1px solid green');
});

But this doesn’t work. Top has the value ‘auto’. Fiddle: http://jsfiddle.net/forgetcolor/qUjWq/

I’m guessing this has something to do with computed styles (?) but am not sure. What’s up with this, and is there a way to distinguish tags based on style? (In my app I don’t have control over the HTML that was written so changing it is not an option).

Answer 1

Beats me as to why, but you can just do this:

var top = $(this).get(0).style.top;