title: Closing a menu when you click on it or outside of it
body: <p>I have a nav in a box with this html:</p>
  
  <pre><code>&lt;nav class="menu" id="theMenu"&gt;
      &lt;div class="menu-wrap"&gt;
          &lt;h1 class="logo"&gt;&lt;a href="index.html#home"&gt;LOGO&lt;/a&gt;&lt;/h1&gt;
  
          &lt;i class="icon-remove menu-close"&gt;&lt;/i&gt;
  
          &lt;a href="#headerwrap"&gt;HOME&lt;/a&gt;
          &lt;a href="#information"&gt;INFO&lt;/a&gt;
          &lt;a href="#portfolio"&gt;Portfolio&lt;/a&gt;
      &lt;/div&gt;
  
      &lt;!-- Menu button --&gt;
      &lt;div id="menuToggle"&gt;&lt;i class="icon-reorder"&gt;&lt;/i&gt;&lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>And this jQuery:</p>
  
  <pre><code>;(function(){
  
          // Menu settings
          $('#menuToggle, .menu-close').on('click', function(){
              $('#menuToggle').toggleClass('active');
              $('body').toggleClass('body-push-toleft');
              $('#theMenu').toggleClass('menu-open');
          });
  
       })(jQuery)
  </code></pre>
  
  <p>Can you please help me and write me what I have to add in the js to close my menu when I click in the menu button but ALSO when I clicked outside ?</p>