My Javascript To RemoveClass + AddClass When Click Only Work On Chrome But Not Firefox Or IE

For some reason, my piece of javascript to remove/add class when clicking on a link only works on Google Chrome. On Firefox, it executes once, then doesn't repeat. On IE, it just s

Solution 1:

You are removing the classes and adding them again immediately after – so if for performance optimization reasons the browser decides not to do a re-paint in between those two actions, there will be no visible effect at all.

By using a small timeout to “de-couple” adding the classes again, it seems to work in FF as well:

$('[data-toggle="tab"]').click(function () {
    $('.tab-pane').removeClass('animated flipInY');
    setTimeout(function () {
        $('.tab-pane').addClass('animated flipInY');
    },
    10);
});

http://jsfiddle.net/UDxtM/3/