title: Close jQuery Menu Operated by .slideToggle when Clicked Outside
body: <p>I've seen a few similar questions but my menu open/close functionality is operated by slideToggle() rather than a class, and I'd rather not change my CSS to make it work.</p>
  
  <p>I need the menu to close when the user clicks anywhere else on the page.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="select"&gt;
      &lt;button class="select__selector"&gt;Reveal menu&lt;/button&gt;
      &lt;ul class="select__select"&gt;
          &lt;li class="select__option"&gt;&lt;a&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li class="select__option"&gt;&lt;a&gt;&lt;/a&gt;&lt;/li&gt;
          ...
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var langTrigger = jQuery('.select__selector');
  var langList = jQuery('.select__select');
  
  // Trigger active state.
  langTrigger.click(function() {
      langTrigger.toggleClass('open');
      langList.slideToggle(200);
  });
  
  // Close list when page is loading.
  langList.click(function() {
      langTrigger.click();
  });
  </code></pre>
  
  <p>I've tried a few things but this was as close as I got.</p>
  
  <pre><code>if((langTrigger).hasClass('open')) {
       jQuery('body').on('click', function() {
           langList.css({display: 'none'});
       });
  }
  </code></pre>