Using delay() with removeClass()

Question

How do I delay the removal of a css class in jQuery?

Here is my code

$(this).addClass("uk-form-danger").delay(5000).removeClass("uk-form-danger");

The above code does nothing. I can add the class with the following code

$(this).addClass("uk-form-danger");

and I can remove it with

$(this).removeClass("uk-form-danger");

but I can't delay the removal of the class.

Answer 1

You can easily accomplish that with a setTimeout:

var myItem = $(this);

myItem.addClass("uk-form-danger");
setTimeout( function(){ myItem.removeClass("uk-form-danger"); }, 5000 );

Answer 2

jquery delay is only intended to use with animations, you will not be able to delay the removeClass this way, use setTimeout instead:

var $el = $('#myId');
$el .addClass("uk-form-danger")
setTimeout(function(){
    $el .removeClass("uk-form-danger");
}, 5000);