Javascript jquery-切换子项时不切换父项

我想为移动站点创建一个java脚本下拉菜单。 问题是，当我单击level2中的列表项时，通过level1的切换，level2（和level3）的列表项将关闭，因此我必须再次单击level1的列表项以查看level2和level3。如果单击level2的列表项，如何停用level1的切换？ 请给我指一下正确的方向。谢谢大家!

这是我的html：

<div id="menu">
   <ul>
     <li class="level1"><a href="/xyz.html">
     <li class="level1"><a href="/xyz.html">    
        <ul>
           <li class="level2"><a href="/xyz.html">
           <li class="level2"><a href="/xyz.html">  
             <ul>
               <li class="level3"><a href="/xyz.html">
               <li class="level3"><a href="/xyz.html">
             </ul>
           <li class="level2"><a href="/xyz.html">
        </ul>
     <li class="level1">
     <li class="level1">
   </ul>
</div>

使用

---

你能为这个做小提琴吗。？

$(document).on('pageinit',function(e,data){    
    // close menu if you go to another page
    $('#menu').hide(); 
    $('.level2').hide();
    $('.level3').hide(); 

    // Do not link if a sub-menu is present
    $('li:has(ul) > a').replaceWith(function() {
    return $(this).text();
    });

  // at click on menu-button scroll to top and open menu
  $(document).off('click', '#menuicon').on('click', '#menuicon',function(e) {
    $('html, body').stop().animate({ scrollTop : 0 }, 0);
    $('#menu').slideToggle(400);
  }); 

  // elements of the menu, different sub-menus width different classes
  $('#menu').on('click','.level1',function(e) { 
    $(this).find('.level2').slideToggle();
  });

  $('#menu').on('click','.level2',function(e) { 
    $(this).find('.level3').slideToggle();
  });

  $('#menu').on('click','.level3',function(e) {
    $('.level3').hide();
    $('.level2').hide();
    $('.level1').hide();
    $('#menu').hide();
  });

});

$('#menu').on('click','.level1',function(e) { 
e.stopPropagation();
    $(this).find('.level2').slideToggle();
  });

  $('#menu').on('click','.level2',function(e) { 
e.stopPropagation();
    $(this).find('.level3').slideToggle();
  });

  $('#menu').on('click','.level3',function(e) {
e.stopPropagation();
    $('.level3').hide();
    $('.level2').hide();
    $('.level1').hide();
    $('#menu').hide();
  });