Помогите с мобильным меню

возникла проблема с мобильным меню. При переходе на разные страницы сайта с ним проблем нет, но когда пытаешься перейти на якорь одной страницы меню переходит, но при этом не исчезает, и непонятно ты перешел по ссылке или нет. Поискал в интернете, но толкового решения не нашел, или же моих скудных познаний в JS не хватило их понять. Однако нашел вот такой кусок кода:

$(document).on("click", function(e) { 
  if (e.target.id != 'test' && e.target.id != 'menu') { 
    $("#menu").hide(); 
  } else if (e.target.id != 'menu') { 
    $("#menu").toggle(); 
  } 
});

Теперь при нажатии на кнопку меню открывает нужную часть сайта и исчезает, но возникла другая проблема, повторно меню открыть невозможно. Оно вроде как открываеться, но его не видно. При перезагрузке страницы так же...один раз открывается и все... Помогите решить проблему)

<nav class="xs-menus"> 
			<div class="nav-header"> 
				<div class="nav-toggle" id="test"></div> 
			</div> 
			<div class="nav-menus-wrapper" id="menu"> 
				<ul class="nav-menu"> 
                   <li><a href="">Test</a></li> 
                   <li><a href="">Test</a></li> 
                   <li><a href="">Test</a></li> 
                 </ul> 
            </div> 
</nav>