title: Slide down a set of hidden <li> s one at a time
body: <p>I would like to slide down some li's one at a time on clicking a button .</p>
  
  <p>I mocked up a little fiddle with what I currently have <a href="http://jsfiddle.net/S5T7N/" rel="nofollow">http://jsfiddle.net/S5T7N/</a> .</p>
  
  <pre><code> &lt;div id="dropdown"&gt;
  
  
      &lt;h1&gt;when you click here&lt;/h1&gt;
  
      &lt;ul&gt;
      &lt;li&gt;We&lt;/li&gt;
      &lt;li&gt;Will&lt;/li&gt;
      &lt;li&gt;Slide Down&lt;/li&gt;
      &lt;li&gt;One At A Time&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  </code></pre>