How to make work my mobile menu

Hello, I’ve a navigation menu which dissappears when the breakpoint is 640px and an icon appears. When I click on this icon my menu reopens and it doesn’t close and when I resize the browser it doesn’t back to the normal style. For sure sth doesn’t work in my if satements.

Thanks for your help!

ocument.body.addEventListener('click', function (e) {
  if ('.fa-grip-lines')) { 
    let elem = document.querySelector('#menuMobile');
    if ( === 'none'&& window.innerWidth < '640') {
    else if (window.innerWidth > '640' ) { = 'block';
    { = 'none';
.menuMobile {
      margin-top: 10%;
      margin-left: 10%;
      margin-right: 10%;
      margin-bottom: 35%;
      height: 62%;
      @media only screen and (max-width: $sm) {
        display: none;
        width: 0%;
        background-color: black;
        position: absolute;
      display : block!important;
      position : absolute;
      width: 100%;
      height : 140%;
      z-index: 900;
      // top : -10%;
      padding : 25% 10% 10% 20%;
      margin-left: 0%;
      margin-right: 0%;
      background-color: black;
<div class="sous-menu-burger">

        <i class="fas fa-grip-lines"></i>


    <div class="cont-main">

        <div id="menuMobile" class="menuMobile"> 

                <a href="#"><div class="home-a">Home</div></a>

                <a href="#"><div class="about-a">About</div></a>

                <a href="#"><div class="skills-a">Skills</div></a>

                <a href="#"><div class="projects-a">Projects</div></a>

                <a href="#"><div class="contacts-a">Contacts</div></a>


Without the HTML it’s a little hard to test. I didn’t really look at your code though.

I would suggest you create a CSS class that you toggle on/off instead of using inline styles set in JS (it’s cleaner and also avoids specificity issues).

Thanks, I’ll try to create a CSS class.