title: Navigation bar not working properly in jQuery
body: <p>Im currently working in ASP.NET and have some trouble resolving this issue.
  I have this code in HTML like this</p>
  
  <pre><code> &lt;li&gt;&lt;a href="#"&gt;Rooms&lt;/a&gt;
                      &lt;ul&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Regular&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;Deluxe&lt;/a&gt;&lt;/li&gt;
                          &lt;li&gt;&lt;a href="#"&gt;King's&lt;/a&gt;&lt;/li&gt;
                      &lt;/ul&gt;
                   &lt;/li&gt;
  </code></pre>
  
  <p>Then ofcourse I want it to be like a pop up when I hover it. So i added this code</p>
  
  <pre><code> &lt;script type="text/javascript" src="JavaScript/jquery-1.3.2.min.js"&gt; &lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          function mainmenu() {
              $(" #nav ul ").css({ display: "none" });
              $("#nav li").hover(function () {
                  $(this).find('ul:first').css({visibility:"visibile",display:"none"}).show(200);
              }
              , function () {
                  $(this).find ('ul:first').css ({visibility:"hidden"});
              })
          }
          $(document).ready(function () {
              mainmenu();
          });
          &lt;/script&gt;
  </code></pre>
  
  <p>All is working well on the first time I hover on the "Room" link, but when i hover someplace else then hover it back to "Room" it didn't pop-up. Help?</p>