Ich habe eine verschachtelte Liste (siehe code). Nun möchte ich, daß beim Laden der Seite erst mal nur die Themen angezeigt werden. Bei hover sollen die Kapitel angezeigt werden, und erst bei hover über die Kapitel die entsprechenden Unterkapitel. Seit drei Tagen schlage ich mich mit diesem Problem rum.
Danke im voraus für Eure Hilfe.

<ul class="navithema">
<li><a href="index.php">Thema 1</a>
<ul class="navikapitel">
<li><a href="index.php">Kapitel 1.1</a>
<ul class="naviunterkapitel">
<li><a href="">Unterkapitel 1.1.1</a></li>
<li><a href="">Unterkapitel 1.1.2</a></li>
</ul>
</li>
<li><a href="index.htm">Kapitel 1.2</a>
<ul class="naviunterkapitel">
<li><a href="">Unterkapitel 1.1.1</a></li>
<li><a href="">Unterkapitel 1.2.2</a></li>
</ul>
</li>
</ul>
</li>
</ul>

jQuery(function($){
    $('ul.navithema').delegate('li','mouseover', function( event){
        $(this).children('ul').show();
    }).delegate('li','mouseout', function( event){
        $(this).children('ul').hide();
    }).find('ul').hide();
});

Live Demo

Gruß, Hase