show and hide list elements in a sequence <p>I'm trying to show and hide list elements (that I can't advice a individual class to) in a sequence, i.e. delayed.</p> <p>this is my html…</p> <pre><code>&lt;ul id="aclass"&gt; &lt;?php for ($i = 0; $i &lt; count($enties); ++$i) : &lt;li class="animation"&gt; &lt;div id="frame"&gt; &amp;nbsp; &lt;/div&gt; &lt;/li&gt; &lt;?php endfor; ?&gt; &lt;/ul&gt; </code></pre> <p>so far I have</p> <pre><code>$(document).ready(function() { function showpanel() { $("ul#aclass &gt; li").each(function() { $(this).css("display", "none"); }); setTimeout(showpanel, 200) }); </code></pre> <p>I want to see the first li element for two seconds, then replaced but the second one for two seconds, then the next one etc. I don't know how to select the "next" li element and to run the function on each element successively.</p> <p>Thanks for help.</p>