title: Getting first visible element with jQuery
body: <p>Trying to get the first visible element of a list using jQuery's <code>:first</code> and <code>:visible</code> pseudo-selectors, as suggested here: <a href="https://stackoverflow.com/a/830611/165673">https://stackoverflow.com/a/830611/165673</a> but it's not working:</p>
  
  <p><strong>Fiddle:</strong> <a href="http://jsfiddle.net/FAY9q/4/" rel="noreferrer">http://jsfiddle.net/FAY9q/4/</a></p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;Item A&lt;/li&gt;
      &lt;li&gt;Item B&lt;/li&gt;
      &lt;li&gt;Item C&lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul&gt;
      &lt;li style="display:none;"&gt;Item A&lt;/li&gt;
      &lt;li&gt;Item B&lt;/li&gt;
      &lt;li&gt;Item C&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>JQUERY:</strong></p>
  
  <pre><code>$('li:visible:first').css('background','blue');
  </code></pre>
  
  <p>The first item in each list should turn blue...</p>