toggle menu - sub menu on click - jQuery / HTML

I have this menu:

      <div id="menu">
            <div class="header">Menu Header</div>
            <ul>
                <li>asdfsadfdsaf</li>
                <li>sadfsadf</li>
                <l开发者_运维技巧i>asdfasdf</li>
                <li>asdfsadf</li>
                <li>asdfsadf</li>
            </ul> 
         </div>

How can I do, so whenever I click on one of the links inside each LI, a new sub-menu will toggle in "under" the clicked one?

Here is a simple menu pattern to follow:

http://jsfiddle.net/Diodeus/jejNy/

First, you need different markup:

<div id="menu">
    <div class="header">Menu Header</div>
    <ul>
        <li>
            <span>Menu item</span>
            <ul>
                <li>Submenu item</li>
                <li>Submenu item</li>
                <li>Submenu item</li>
            </ul>
        </li>
        <li>
            <span>Menu item</span>
            <ul>
                <li>Submenu item</li>
                <li>Submenu item</li>
                <li>Submenu item</li>
            </ul>
        </li>
        ...
    </ul> 
</div>

And simply apply the css and js to the submenu, just like u did with the mainmenu