title: jQuery hide show id
body: <p>HTML</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;ul id="menüü"&gt;  
              &lt;li id="meist"&gt;  
                  &lt;p&gt;&lt;a href="meist.html"&gt;Meist&lt;/a&gt;&lt;/p&gt;  
              &lt;/li&gt; &lt;/ul&gt;
  
  
  &lt;div id="submenu"&gt;
      &lt;ul id="submeist"&gt;
          &lt;li class="asi1"&gt;
              Asi 1
          &lt;/li&gt;
          &lt;li class="asi2"&gt;
              Asi 2
          &lt;/li&gt;
          &lt;li class="asi3"&gt;
              Asi 3
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre class="lang-css prettyprint-override"><code>#meist {  
          display: inline;
          float:left;
          width:180px;  
          height:50px;  
          color:#191919;  
          text-align:center;  
          overflow:hidden; 
          background:#990000;
          -moz-border-radius-top-left: 50px;
          border-top-left-radius: 50px;
  
      } 
  
  #submeist
      {   
          font-size:12px;
          display:none;
      }
  
      #submeist .asi1
      {
          margin-left:70px;
      }
  
          #submeist .asi2
      {
          margin-left:25px;
      }
  
      #submeist .asi3
      {
          margin-left:25px;
      }
  </code></pre>
  
  <p>JS</p>
  
  <pre class="lang-js prettyprint-override"><code>$("#meist").mouseout(function () { 
      $("#submeist").hide();
      return false; 
  });
  
  $("#meist").mouseenter(function () { 
      $("#submeist").show();
      return false; 
  });
  </code></pre>
  
  <p>I am here again to learn and find out how to show "submeist" when mouse hovers "meist". 
  I have learned some VERY basics of jQuery, but somehow this code is not working.
  Help is much appreciated and if possible than lots of comments :)</p>