[jQuery] A complicated menu. Need some help.

[suntrop]

My navigation menu is quite complicated and I can't get it working.
Can someone please help?

That's what I want and have until now:

A nested <UL> menu that slides to the left if I click a link with sub-
menus and fade in the sub-menu.
(sub-menus are not displayed by default via css)

<ul id="navigation">
        <li>Home</li>
        <li><span>Products</span>
                <ul class="level2">
                        <li>Product A</li>
                        <li><span>Product B</span>
                                <ul class="level3">
                                        <li>Product B Info</li>
                                </ul>
                        </li>
                        <li>Product C</li>
                </ul>
        </li>
        <li><span>Team</span>
                <ul class="level2">
                        <li>Boss</li>
                        <li>Sales Team</li>
                        <li>Bob</li>
                </ul>
        </li>
        <li>Contact</li>
</ul>

jQuery:
$("#navigation span").click(function () {
        // move the whole ul#navigation 100px to the left
        $(this).parent().parent().animate({left:'-100px'},'slow');
        // … and show the first submenu level2 (links products a-c)
        $(this).next.show();

        // but how can I 'see' if it is a nested span I click on and move
#navigation and the nested ul?
       // and maybe the #navigation the nested ul and another nested
ul?
});


Thanks a million for any help!!