double alert on a click naviganting index array
<p>I get 2 alert when I click on the sub menu, the pop up first says 1 and then a second pop up gives me 2. I would like the alert to be 0,1,2,3 etc in correct sequence as per navigating an array. Is it not the sub menu item just the following item in an array?</p>

<pre><code>&lt;ul id="menu"&gt;
   &lt;li&gt;&lt;a href="page1"&gt;Item 1&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="page2"&gt;Item 2&lt;/a&gt; 
      &lt;ul id="sub-menu"&gt;
           &lt;li&gt;&lt;a href="page3"&gt;Item 3&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
   &lt;/li&gt;
   &lt;li&gt;&lt;a href="page4"&gt;Item 4&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>Jquery:</p>

<pre><code>jQuery (function($) {
  $("#menu .menu li").each(function (index) {
     var item = $(this);
     $("a", item).click(function (e) {
        e.preventDefault();
        alert(index);
     });
  });
});
</code></pre>
