jQuery add class for certain time

Question

How I can add a css class to an element for only 10 seconds ?

Answer 1

A nicely reusable way would be this little jQuery plugin:

(function($){

    $.fn.extend({ 

        addTemporaryClass: function(className, duration) {
            var elements = this;
            setTimeout(function() {
                elements.removeClass(className);
            }, duration);

            return this.each(function() {
                $(this).addClass(className);
            });
        }
    });

})(jQuery);

Use like so:

$("#myElement").addTemporaryClass("myClass", 10000);

Answer 2

You can add the class, then call setTimeout(function() { ... }, 10000) to remove it 10,000 milliseconds later.