How to close mobile menu when clicking on empty space?

Question

User navigation

/*  Hamburger Menu & Icon  */
  $('.hamburger').on('click', function(e){
    
    e.preventDefault();
    $(this).toggleClass('opned');
    $('header nav').toggleClass('active');
    
  });

it is clear that 2 classes are assigned opned and active

<header>
      <div class="wrapper">
                              <div class="logo">
        <a href="tel: [phone]">[phone]</a>
</div>
        <a href="#" class="hamburger"></a>
        <nav class="">
          <ul>
            <li><a href="#">Buy</a></li>
            <li><a href="#">Rent</a></li>
            <li><a href="#">Sell</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
          </ul>
        </nav>
      </div>
    </header>

help! So that when you click on an empty space, these classes are deleted?