Getting first visible element with jQuery

Question

Trying to get the first visible element of a list using jQuery\'s :first and :visible pseudo-selectors, as suggested here: https://stackoverflow.co

Answer 1

Try using this:

$('ul').find('li:visible:first').css('background','blue');

Currently your code is just getting the first visible li element on the page and setting the background colour. This code selects all ul elements then finds the first visible li within each of them and applies the style.

Here it is working: http://jsfiddle.net/FAY9q/5/

Answer 2

What about using this:

li:visible:not(:visible ~ :visible)

Answer 3

$('li:visible').eq(0).css('background','blue');