jquery - I have this menu responsive and i want it to close when click on li (close when click on links) -

i have menu responsive, menu single page, various things. code have, when click on li (link) it's not closing or hiding, want close or hide when click's on it. thank's help.

/* helper functions */  function _hasclass(elem, classname) {    return new regexp(' ' + classname + ' ').test(' ' + elem.classname + ' ');  }    function _toggleclass(elem, classname) {      var newclass = ' ' + elem.classname.replace(/[\t\r\n]/g, ' ') + ' ';      if (_hasclass(elem, classname)) {        while (newclass.indexof(' ' + classname + ' ') >= 0) {          newclass = newclass.replace(' ' + classname + ' ', ' ');        }        elem.classname = newclass.replace(/^\s+|\s+$/g, '');      } else {        elem.classname += ' ' + classname;      }    }    /* responsivemenu class constructor */    function responsivemenu(settings) {    if (!settings) return;      this.nav = document.getelementsbyclassname(settings.navclass)[0];    this.mobile = settings.mobileclass;    this.toggle = document.getelementsbyclassname(settings.toggleclass)[0];    this.innertoggle = settings.innertoggle ? document.getelementsbyclassname(settings.innertoggle) : false;      this.navopen = settings.navopen || 'nav-mobile-open';    this.toggleactive = settings.toggleactive || 'nav-active';    this.innertoggleactive = settings.innertoggleactive || 'nav-active-inner';      this.jquery = (window.jquery) ? jquery : false;      this.init();  }  responsivemenu.prototype.createmenu = function() {    this.mobileelem = document.createelement('div');    this.mobileelem.classname = this.mobile;    this.nav.appendchild(this.mobileelem);  };  responsivemenu.prototype.bindhandlers = function() {    var _self = this;    var piece = void 0;      this.mobileelem.addeventlistener('click', function() {      if (_self.jquery) {        _self.jquery(_self.toggle).slidetoggle(function() {          _self.jquery(this).attr('style', '');          _toggleclass(this, _self.navopen);          _toggleclass(_self.toggle, _self.toggleactive);        });      } else {        _toggleclass(this, _self.navopen);        _toggleclass(_self.toggle, _self.toggleactive);      }    });      if (this.innertoggle && !this.jquery) {      (piece in this.innertoggle) {        if (!isnan(parseint(piece))) {          this.innertoggle[piece].addeventlistener('click', function() {            _toggleclass(this, _self.innertoggleactive);          });        }      }    }      if (this.jquery) {      this.jquery(this.innertoggle).on({        click: function() {          var trigger = this;          var menu = jquery(this).find('ul');          menu.slidetoggle(function() {            _toggleclass(trigger, _self.innertoggleactive);          });        }      });    }  };  responsivemenu.prototype.init = function() {    this.createmenu();    this.bindhandlers();  };      (function() {    var r_menu = new responsivemenu({      navclass: 'nav', // main navigation container => css selector      mobileclass: 'nav-mobile', // class mobile navigation trigger create , append => not selector      toggleclass: 'nav-list', // class of navigation list (the <ul> example) => css selector      innertoggle: 'has-inner', // class of inner toggle elements => css selector, parents of sub elements      innertoggleclass: 'nav-inner', // class inner navigation => css selector        /* open state */      navopen: 'nav-mobile-open',      toggleactive: 'nav-active',      innertoggleactive: 'nav-active-inner'    });  })();

<div class="header_bg">    <div class="wrap">      <div class="header">        <div class="logo">          <h1><a href="index.html"><img src="images/logo.png" alt=""/></a></h1>        </div>        <div class="h_right">          <ul class="menu">            <li><a href="#home">inicio</a>            </li>            <li><a href="#empresa" class="scroll">empresa</a>            </li>            <li><a href="#cartadecolores" class="scroll">carta de colores</a>            </li>            <li><a href="#galeria" class="scroll">trabajos realizados</a>            </li>            <li class="last"><a href="#contact" class="scroll">presupuesto</a>            </li>          </ul>            <!-- start smart_nav * -->          <nav class="nav">            <ul class="nav-list">              <li class="nav-item"><a href="#home">inicio</a>              </li>              <li class="nav-item"><a href="#empresa" class="scroll">empresa</a>              </li>              <li class="nav-item"><a href="#cartadecolores" class="scroll">carta de colores</a>              </li>              <li class="nav-item"><a href="#galeria" class="scroll">trabajos realizados</a>              </li>              <li class="nav-item"><a href="#contact" class="scroll">presupuesto</a>              </li>              <div class="clear"></div>            </ul>          </nav>          <script type="text/javascript" src="js/responsive.menu.js"></script>          <!-- end smart_nav * -->        </div>        <div class="clear"></div>      </div>    </div>  </div>

you can use jquery below hide menu when registers click on .nav-item (the class of li-items).

$('.nav-item').click(function () {     $('.nav-list').css('display', 'none');     //or other effect hide nav }); 

jsfiddle