jQuery - Why is my loop running twice?
<p>I have a loop that runs through first level LI items of a menu. I want to detect the end of the loop, however, the print out I get seems to run twice.</p>

<p>Here's my JS:</p>

<pre><code>var numNavItems = $("#navigation &gt; li").size() - 1;

$("#navigation &gt; li").each(function(i) {

    $(this).delay( i * 300 ).animate({ opacity: 1 }, 300);

// This runs twice
    $("#content").append("&lt;p&gt;Loop number: " + i + " out of " + numNavItems + "&lt;/p&gt;");

    if( i == numNavItems) {
        //$("#navigation li").css({ "opacity" : 1 });
        //alert("End! Number of items = " + numNavItems + ". Last item = " + i );

    }

});
</code></pre>

<p>So, my logic fires twice. Not sure why, could it be my nested list?</p>

<p>Here's the HTML...</p>

<pre><code>&lt;ul id="navigation"&gt;
                &lt;li class="selected"&gt;&lt;a href="./"&gt;Home&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="./portfolio/"&gt;Portfolio&lt;/a&gt;

                    &lt;ul&gt;
                        &lt;li&gt;&lt;a href="#"&gt;Cosmos&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;&lt;a href="#"&gt;Remora&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;&lt;a href="#"&gt;Caspian&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;&lt;a href="#"&gt;Megaway&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;

                &lt;/li&gt;
                &lt;li&gt;&lt;a href="./philosophy/"&gt;Philosophy&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="./about/"&gt;About&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="./contact/"&gt;Contact&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
</code></pre>

<p>I used the ">" to find only the first level LI's.</p>

<p>It prints:</p>

<pre><code>Loop number: 0 out of 4

Loop number: 1 out of 4

Loop number: 2 out of 4

Loop number: 3 out of 4

Loop number: 4 out of 4

Loop number: 0 out of 4

Loop number: 1 out of 4

Loop number: 2 out of 4

Loop number: 3 out of 4

Loop number: 4 out of 4
</code></pre>

<p>Many thanks for your help.
Michael.</p>
