Javascript 如何通过单击jquery中的另一个菜单来关闭一个菜单及其图标？

当我单击一个菜单时，它会显示并在菜单上显示十字，但当我单击搜索菜单时，它也会显示在同一菜单中并显示十字图标

我想点击一个菜单关闭另一个菜单并将图标更改为默认值

$('.toggle-sm-nav, .js-toggle-sm-navigation').click(function(){

    // Change button
    $(this).children('span').toggleClass('glyphicon-align-justify icon-close-menu-cross2');
    $('.sm-searchboxc').find('i').removeClass('active');

    // Toggle menu on hamburger
    $('.navcontainer').toggle();
    $('.header-nav-container').toggleClass('brgropen');

    if( $('.header-nav-container').hasClass('brgropen') ){
        $('body').css('overflow', 'hidden');
    } else {
        $('body').css('overflow', 'visible');
    }

    // Focus search field when opened
    $('.js-toggle-xs-search').on('click', function(){
        $('.sm-searchboxc input#search').trigger('touchstart');

    });
    $('.sm-searchboxc input#search').on('touchstart', function(){
        setTimeout(function(){
            $('.sm-searchboxc input#search').focus();
        }, 0);    
   });

与菜单相关的HTML代码

<div class="sm-navigation">
                <div class="row">

                    <div class="sm-nav col-xs-1 col-sm-1 visible-sm">
                        <button class="btn btn-default js-toggle-sm-navigation toggle-sm-nav btn-sm" type="button">
                            <span class="glyphicon glyphicon-align-justify"></span>
                        </button>
                    </div>

                    <div class="col-xs-12 col-sm-2 col-md-2 logocontainer">
                        <div class="site-logo">

                            <div class="content"><a href="/"><img src="/_ui/responsive/theme-blue/images/abc.svg"></a></div></div>
                    </div>

                    <div class="xs-nav col-xs-3 col-sm-3 visible-xs">
                        <button class="btn btn-default js-toggle-sm-navigation" type="button">
                            <span class="glyphicon glyphicon-align-justify"></span>
                        </button>
                    </div>

                    <div class="xs-store-finder col-xs-3 visible-xs ">
                        <a href="/store-finder">
                            <button class="btn btn-default btn-sm" type="button">
                                <span class="glyphicon icon-store-locator"></span>
                            </button>
                        </a>
                    </div>

                    <div class="xs-search col-xs-3 visible-xs">
                        <button class="btn btn-default js-toggle-xs-search toggle-xs-search btn-sm" type="button">
                                <span class="glyphicon icon-search"></span>
                            </button>
                        </div>

                    <div class="searchboxc md-searchboxc col-xs-12 col-sm-5 col-md-5 hidden-xs hidden-sm">
                        <div class="site-search ui-front">
    <form id="search-form" name="search-form" method="get" class="search-form ng-pristine ng-valid ng-scope ng-valid-maxlength" ng-submit="search.submit()" ng-controller="SearchController as search" action="/search/">

if（$（'.xs search>button>span'）.hasClass（'icon-close-menu-cross2'））{
$（'.xs search>button>span'）.removeClass（'icon-close-menu-cross2'）.addClass（'icon-search'）；
$（'.sm searchboxc input#search'）.hide（）；
$（'.searchboxc'）.find（'.site search'）.removeClass（'active'）；
}
$（'.navcontainer'）.toggle（）；
$（'.header nav container'）.toggleClass（'brgropen'）；
if（$（'.header nav container'）.hasClass（'brgropen'））
$（'.js切换xs搜索'）。在（'click'，function（）上{
变量宽度=$（窗口）.width（）；
if（宽度
if（$（'.xs搜索>按钮>span'）.hasClass（'icon-close-menu-cross2'））{
$（'.xs search>button>span'）.removeClass（'icon-close-menu-cross2'）.addClass（'icon-search'）；
$（'.sm searchboxc input#search'）.hide（）；
$（'.searchboxc'）.find（'.site search'）.removeClass（'active'）；
}
$（'.navcontainer'）.toggle（）；
$（'.header nav container'）.toggleClass（'brgropen'）；
if（$（'.header nav container'）.hasClass（'brgropen'））
$（'.js切换xs搜索'）。在（'click'，function（）上{
变量宽度=$（窗口）.width（）；
如果你能提供你的HTML代码吗？它提供了，谢谢你的快速反应。高度赞赏你能提供你的HTML代码吗？它提供了，谢谢你的快速反应。高度赞赏
       if ($('.xs-search > button > span').hasClass('icon-close-menu-cross2')) {
         $('.xs-search > button > span').removeClass('icon-close-menu-cross2').addClass('icon-search');
         $('.sm-searchboxc input#search').hide();
         $('.searchboxc').find('.site-search').removeClass('active');
       }
       $('.navcontainer').toggle();
       $('.header-nav-container').toggleClass('brgropen');
       if ($('.header-nav-container').hasClass('brgropen'))

         $('.js-toggle-xs-search').on('click', function() {
         var width = $(window).width();
         if (width <= 968) {
           if ($('.sm-searchboxc input#search').hide()) {
             $('.sm-searchboxc input#search').show();
           } else if ($('.xs-search > button > span').hasClass('icon-close-menu-cross2')) {
             $('.sm-searchboxc input#search').trigger('touchstart');
           }
           if ($('.header-nav-container').hasClass('brgropen')) {
             $('.toggle-sm-nav, .js-toggle-sm-navigation').children('span').toggleClass('glyphicon-align-justify icon-close-menu-cross2');
             $('.navcontainer').hide();
             $('.header-nav-container').removeClass('brgropen');
           }
         } else {
           $('.sm-searchboxc input#search').trigger('touchstart');
         }
       });
       $('.sm-searchboxc input#search').on('touchstart', function() {
             setTimeout(function() {
                   $('.sm-searchboxc input#search').focus();