Firefox only runs the CSS animation once

Question

I'm building an open source tab system for beginners to start off with. I think i've found a bug in how Firefox renders CSS animations.

Tab animations only fire once in firefox

I am using Dan Edens animate.css to do the animation for each tab. Everything works fine in Chrome, and Safari however firefox only runs the animation once and then never triggers it again.

Take a look at the following demo on jsfiddle to see exactly what i'm talking about: http://jsfiddle.net/jsheffers/vqdJK/

$('#tabs li a').click(function(e){

    $('#tabs li, #content .current').removeClass('current');
    $(this).parent().addClass('current');
    var currentTab = $(this).attr('href');
    $(currentTab).addClass('current fadeInLeft');
    e.preventDefault();

});

Answer 1

You forgot to remove the fadeInLeft class (fiddle).

$('#tabs li, #content .current').removeClass('current').remove('fadeInLeft');

It works then fine in Firefox!