jquery - jqueryのシンプルな折りたたみ可能なリストの問題

Question

各 ul が折りたたみ可能な単純な折りたたみ可能なマルチレベルを作成しようとしています。私は自分が間違っていることを理解するのに苦労しています。私のスクリプトはjsfiddleです

<ul id="usernav">
<li>Manage
    <ul >
        <li >child11
         <ul>
             <li> some1</li>
             <li> some2</li>
         </ul>
        </li>
        <li>child12</li>
    </ul>
</li>
<li>Subscriptions
    <ul>
        <li>E-Briefings</li>
        <li>E-Briefings Subscriptions</li>
        <li>Knowledge Briefings</li>
    </ul>
</li>
  <li>Media Store
    <ul>
        <li>Image Store</li>
        <li>Document Store</li>
        <li>Media Store</li>
    </ul>
</li>

私のスクリプトは

 $('#usernav').find('ul').hide();    
$('li').click(function() {
    $(this).children('ul').toggle();
});