title: jquery fadein fadeout problem in firefox
body: <p>I want to initially hide .noteHover and then use a hover event that will fade this class in and then out very quickly. This seems to work fine in chrome but my problem is that in ff .noteHover remains as display:none which prevent the fadein fadeout effect, can anyone offer some advice to where im going wrong?</p>
  
  <p>Here is my code:</p>
  
  <pre><code>/* Hover test */
          /* Hover test */        
          var $notes = $('.note');
  
          $notes.each(function() {
           var thisNote = $(this);
           var nestedNoteHover = thisNote.find('.noteHover');
           var nestedPath = thisNote.find('path');
  
           nestedNoteHover.hide();
  
           thisNote.hover(
            function() {
              nestedPath.css('opacity', 0.8);
              nestedNoteHover.fadeIn(100, function() {
              nestedNoteHover.fadeOut(300);
             });
            },
            function() {
             nestedPath.css('opacity', 1);
            }
           );
          });
  </code></pre>
  
  <p>I have updated the code but still no change on ff?</p>
  
  <p>Thanks!</p>