Блог

У меня есть меню и в мобильном представлении.

Это мой Javascript:

 $('#main-menu li').click(function(e)
{
    $(".mobile-menu-class").css("position", "absolute");
    var $el = $('ul',this); 
    $('#main-menu > li > ul').not($el).slideUp();
    $el.stop(true, true).slideToggle(400); 
});
$('#main-menu > li > ul > li').click(function(e)
{
    e.stopPropagation();  
});
  

И это мой HTML:

 <ul id="main-menu">
    <li class="current-menu-item"><a href="#">Home</a></li>
    <li class="parent">
        <a href="#">Live Timing</a>
        <ul class="sub-menu">
            <li><a href="#">MX World/European</a></li>
            <li><a href="#">MX Austria</a></li>
            <li><a href="#">SM Austria</a></li>
            <li><a href="#">MX Slovenia</a></li>
        </ul>
    </li>
    <li class="parent"> <a href="#">Motosross</a>
        <ul class="sub-menu">
            <li>
                <a class="parent" href="#">MX Austria</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                    <li><a href="#">2007</a></li>
                    <li><a href="#">2006</a></li>
                </ul>
            </li>
            <li>
                <a class="parent" href="#">MX Slovenia Drzavno</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                    <li><a href="#">2014</a></li>
                    <li><a href="#">2013</a></li>
                </ul>
            </li>
            <li>
                <a class="parent" href="#">MX Slovenia Pokalno</a>
                <ul class="sub-menu hidden-submenu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                    <li><a href="#">2008</a></li>
                </ul>
            </li>
            <li>
                <a class="parent" href="#">MX Hrvatska</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                </ul>
            </li>
            <li>
                <a class="parent" href="#">MX European / World</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                    <li><a href="#">2014</a></li>
                    <li><a href="#">2013</a></li>
                    <li><a href="#">2012</a></li>
                    <li><a href="#">2011</a></li>
                    <li><a href="#">2006</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="parent">
        <a href="#">Supermoto</a>
        <ul class="sub-menu">
            <li><a class="parent" href="#">SM Austria</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="parent">
        <a href="#">Karting</a>
        <ul class="sub-menu">
            <li><a class="parent" href="#">Kart Slovenia</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2008</a></li>
                    <li><a href="#">2007</a></li>
                    <li><a href="#">2006</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="parent">
        <a href="#">Cross-Country</a>
        <ul class="sub-menu">
            <li>
                <a class="parent" href="#">CC Slovenia</a>
                <ul class="sub-menu">
                    <li><a href="#">2016</a></li>
                    <li><a href="#">2015</a></li>
                    <li><a href="#">2012</a></li>
                    <li><a href="#">2011</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="#"><i class="fa fa-facebook-official" aria-hidden="true"></i></a></li>
    <li class="search-btn"><a href="#"> <i class="fa fa-search" aria-hidden="true"></i></a></li>
</ul>
  

Все работает нормально, но когда я нажимаю на меню, в котором есть подменю и в котором есть подменю, в котором также есть еще несколько подменю, они открываются до того, как я нажимаю на них.
Как это можно исправить?