<nav class="navigation menu menu-position menu-hidden">
  123
</nav>

<button class="btn">
  кнопка
</button>
.navigation {
  background-color: green;
  width: 700px;
  height: 70px;
}

.menu-hidden {
  display: none;
}
const menu = document.querySelector(".menu");
const toggler = document.querySelector(`.btn`);

if (menu) {
  document.addEventListener("click", function (e) {
    e.preventDefault();
    
    menu.classList.add("menu-hidden");
  });
  
  toggler.addEventListener(`click`, (e) => {
    e.preventDefault();
    e.stopPropagation(); // остановить всплытие
    
    menu.classList.toggle(`menu-hidden`);
  });
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.