Hide menu when link is clicked

Hi,

I have a mobile menu created with the following code:

<nav class="navbar-collapse bs-navbar-collapse collapse in" id="site-navigation" itemscope="" itemtype="http://schema.org/SiteNavigationElement" style="height: auto;">
<a class="screen-reader-text skip-link" href="#content">Skip to content</a>
<ul id="menu-menu-1" class="nav navbar-nav navbar-right responsive-nav main-nav-list"><li id="menu-item-5" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-5"><a href="#top">Home</a></li>
<li id="menu-item-7" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7"><a href="#aboutus">About us</a></li>
<li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-8"><a href="#employment">Employment</a></li>
</ul
</nav>

What I would like to do is to hide/collapse the menu on mobile when a link is clicked as it currently stays collapsed on the screen.

I’ve tried this, but no luck

jQuery(document).ready(function($){
$('#site-navigation li').on('click', function(){
        $("#site-navigation").hide();
        $("#menu-icon").removeClass("active");
    });
    });

Any ideas how I can do this?

Thanks

Though the ul tag is not properly closed, the code should work. Here’s the correct HTML

<nav class="navbar-collapse bs-navbar-collapse collapse in" id="site-navigation" itemscope="" itemtype="http://schema.org/SiteNavigationElement" style="height: auto;">
<a class="screen-reader-text skip-link" href="#content">Skip to content</a>
<ul id="menu-menu-1" class="nav navbar-nav navbar-right responsive-nav main-nav-list"><li id="menu-item-5" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-5"><a href="#top">Home</a></li>
<li id="menu-item-7" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7"><a href="#aboutus">About us</a></li>
<li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-8"><a href="#employment">Employment</a></li>
</ul>
</nav>

Did you include the jQuery library?

If yes, can you share the console error?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.