title: jquery Canceling a delayed (setTimeout) event if something happend
body: <p>In plain English, this code kicks in when an element is hovered over. When it's hovered over, I add a class and show the element, then after 5 seconds, I reverse everthing: i.e. I fade out what I had previously shown and remove the class I previously added. </p>
  
  <pre><code>$("#it").addClass('somestyle').show();
  setTimeout(function(){
     $("#it").fadeOut("normal", function(){ $(this).removeClass('somestyle'); });
  }, 5000);
  </code></pre>
  
  <ul>
  <li>Is my code clean or hacky?</li>
  <li>How to cancel those delayed actions (fadeout and class removal) if I element is hovered over again within those 5 delay seconds. If it's hovered over again, I don't want the planned delayed actions to actually happen. </li>
  </ul>