Как сделать мобильное меню большой вложенности?

Question

[First_Life]

Имею мобильное меню, по клику открывается и закрывается. Но при бОльшей вложенности раскрывается всё, что лежит внутри главного пункта...а закрыться не хочет, дёргается. В общем перерыл инет, не нашёл решения... Прошу помощи
Возможно, html не точный, это больше для понимания сути. Класс parent одинаковый на разных уровнях, но мне казалось свойство this компенсирует это. Сам класс изменить нет возможности, сайт старый написанный на joomla..

<li class='parent'>
  <span class='separator'>click</span>
    <ul class='child'>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li class='parent'>
       <ul class='child'>
         <li>a</li>
         <li>b</li>
       </ul>
      </li>
      <li>4</li>
      <li>5</li>
    </ul>
</li>

jQuery(function($){
let mobSlide = false;
  $('.parent').click(function () {
    if(!mobSlide){
     $(this).find('ul').slideDown();
    }else{
     $(this).find('ul').slideUp();
    }
    mobSlide = !mobSlide;
  });
});

Comments

[Froggyweb]

я использую https://somewebmedia.github.io/hc-offcanvas-nav/
ну или поискать другие варианты multilevel mobile nav.

Answer 1

[Сергей delphinpro]

https://codepen.io/delphinpro/pen/bGjpKWY
https://codepen.io/delphinpro/pen/BEZgwR

Comments

[First_Life]

Спасибо, добрый человек. Не совсем разобрался в скрипте, но немного изменив под себя он работает!)