Detect Click Outside Element

How do I detect a click outside an element?

HTML

<body>
  <div class="menu-button">Menu</div>
  <nav class="nav">
    <ul>
      <li><a href="#">Work</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
  </nav>
</body>

JavaScript

var elMenu = document.getElementsByClassName('menu-button');
var menuButton = elMenu[0];
var elNav = document.getElementsByClassName('nav');
var nav = elNav[0];
var html = document.body.parentNode;

function toggleClassMenu() {
  //toggle logic
}
menuButton.addEventListener('click', toggleClassMenu);

html.addEventListener('click', function(event) {
  event.preventDefault();
  if (menuButton.contains(event.target)) {
    alert('clicked menu link');
  } else {
    alert('clicked outside of menu button');
    nav.classList.remove('navToggle');
  }
});