jquery/javascript menu issue
<pre><code>$(function(){
    $("li.level2").hide();
    $("li.level3").hide();

    $("ul.navigation").delegate("li.level1", "click", function() {
        $("li.level2").toggle().siblings("li.level3").hide();;
    });

    $("ul.navigation").delegate("li.level2", "click", function() {
        $("li.level3").toggle();
    });
});
</code></pre>

<p>I'm using this script to make a drop down menu for my page in jquery, but currently when you click on a level1 list it opens up every level1, when i just want to open the one that was clicked on. ie. it is doing this when i click on the first 1:</p>

<pre><code>1

    2

1

    2
</code></pre>

<p>when i want it to do this</p>

<pre><code>1

    2

1
</code></pre>

<p>I understand you can use the $this function to only open the one selected, but i am unsure how to implement it and whenever i try (this).next it only opens the next one when</p>

<p>I included an active page with styling to make it easier to interpret: <a href="http://jsfiddle.net/K6TSv/1045/" rel="nofollow">http://jsfiddle.net/K6TSv/1045/</a></p>

<p>thanks for your help in advanced, this has been driving my head on.</p>
