title: Stop jquery effect?? Or stop the javascript
body: <p>I have a big ul list. Like this:</p>
  
  <pre><code>&lt;ul class="eerstelaag"&gt;
      &lt;li class=""&gt;&lt;a title="?" href="/"&gt;? (14)&lt;/a&gt;
          &lt;ul class="tweedelaag" style="display: none;"&gt;
              &lt;li&gt;&lt;a href="/"&gt;Roerstaafjes&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Thee favorieten&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Siropen&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;&lt;a title="?" href="/"&gt;? (14)&lt;/a&gt;
          &lt;ul class="tweedelaag" style="display: none;"&gt;
              &lt;li&gt;&lt;a href="/"&gt;Roerstaafjes&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Thee favorieten&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Siropen&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;&lt;a title="?" href="/"&gt;? (14)&lt;/a&gt;
          &lt;ul class="tweedelaag" style="display: none;"&gt;
              &lt;li&gt;&lt;a href="/"&gt;Roerstaafjes&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Thee favorieten&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="/"&gt;Siropen&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>And i have this javascript:</p>
  
  <pre><code>$(function()
          {
              var button = $("#assortiment ul.eerstelaag &gt; li");
  
              button.hover(function()
              {
  
                  if( button.hasClass("open"))
                  {
                      var menuitem = $(this).find("ul"); 
                      menuitem.slideUp(600);
  
                      button.removeClass("open");     
                  }
                  else
                  {
                      var menuitem = $(this).find("ul"); 
                      menuitem.slideDown(600);
  
                      button.addClass("open");
  
                  }
              });
          });
  </code></pre>
  
  <p>When i hover over the first li item. Then the ul in that li is coming and show. But now come the problem. When i going fast hover over the li items. The effect i going crazy. And when i going hover faster and faster. It is a crazy effect.</p>
  
  <p>How can i fix this problem?</p>