title: jquery: click outside to close menu
body: <p>I would like to close a menu by clicking outside.
  This is code. Please keep this code. I want to the <code>menu_list</code> item to that is visible to slideUp before the selected one slidesDown. Then click outside to close menu</p>
  
  <pre><code>&lt;div id="content_wrapper"&gt;
  &lt;section id="menu"&gt;
      &lt;div id="menu_nav"&gt;
          &lt;ul class="menu_top"&gt;
              &lt;li id="menu_starters" class="menu"&gt;STARTERS&lt;/li&gt;
              &lt;li id="menu_mains" class="menu"&gt;MAINS&lt;/li&gt;
              &lt;li id="menu_noodles" class="menu"&gt;NOODLES &amp;amp RICE&lt;/li&gt;
          &lt;/ul&gt;
          &lt;ul id="start_nav" class="menu_sub"&gt;
              &lt;li id="st_meat" class="s_menu"&gt;MEAT &amp;amp FISH&lt;/li&gt;
              &lt;li id="st_veg" class="s_menu"&gt;VEGETARIAN&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;article id="st_meat_list" class="menu_list"&gt;
          &lt;p&gt;Meat&lt;/p&gt;
      &lt;/article&gt;
      &lt;article id="st_veg_list" class="menu_list"&gt;
          &lt;p&gt;Vege&lt;/p&gt;
      &lt;/article&gt;
  </code></pre>
  
  <p>JQuery:</p>
  
  <pre><code>   $('.s_menu, .m_menu').click(function(){
      var menuid = event.target.id;
      var mlist = ('#') + (menuid) + ('_list');
      var last = $('.menu_list').not(mlist);
  
  
          $(last).slideUp(400, function (){
              $(mlist).slideToggle(400);
          });
  
  
          return(false);
  
    });
  </code></pre>
  
  <p>Thank you!!!</p>