javascript - Javascriptでメニューのトグルビューを設定する方法

Question

データベースからのメニューの動的バインディングを使用しています.... 以下のコードを使用して、メニューを正常にバインドしました。私が必要としているのは、javascript を使用してこのメ​​ニューのトグル ビューを設定することです。コードを切り替えるための javascript を提案してもらえますか。

 <nav> @{ List<MenuRazor.Models.MenuItem> menulist = ViewBag.Menu; } 
<ul id="menu">  
    @foreach (var mp in menulist.Where(p => p.ParentMenu_Id == 0)) {
    <li>  @Html.ActionLink(@mp.Name, @mp.ActionName, @mp.ControllerName) 
        @if (menulist.Count(p => p.ParentMenu_Id == mp.Id) > 0)
        { @:<ul> }  
          @RenderMenuItem(menulist, mp)  
          @if (menulist.Count(p => p.ParentMenu_Id == mp.Id) > 0){@:</ul> } 
    </li> } 
</ul> 

@helper RenderMenuItem(List<MenuRazor.Models.MenuItem> menuList, MenuRazor.Models.MenuItem mi) 
{
    foreach (var cp in menuList.Where(p => p.ParentMenu_Id == mi.Id)) {
         @Html.ActionLink(@cp.Name, @cp.ActionName, @cp.ControllerName,new { @style="color:Red;" })

        if (menuList.Count(p => p.ParentMenu_Id == cp.Id) > 0) { 
            @:<ul> 
        } 
        @RenderMenuItem(menuList, cp) 
        if (menuList.Count(p => p.ParentMenu_Id == cp.Id) > 0) { 
           @:</ul> 
        } else  { 
           @:</li> 
        }  
} }   </nav>