title: How to display the first 3 elements in UL only on document load?
body: <p>I have a List (UL) which has a class of .more_stories the UL contains LI. </p>
  
  <p>I use this code to hide them by default on load:</p>
  
  <pre><code>$('ul.more_stories li').css({'display': 'none'});
  </code></pre>
  
  <p>Now I want to display the first 3 li items inside the UL after that. How can I do that in jQuery?</p>
  
  <p>-Note: I have several ULs with the same class.</p>
  
  <p>I try that and I get unexpected results..</p>
  
  <pre><code>// more stories
  $('ul.more_stories li').css({'display': 'none'});
  $('ul.more_stories li:gt(2)').show();
  </code></pre>
  
  <p>Thanks in advance.</p>