Take the 2-minute tour ×

I've the following JavaScript snippet:

$("." + target).addClass("active");
$("#" + target).removeClass("hide").addClass("showDiv");

While #dashboard is in standby, it should handle all this CSS-Class changes. After this changes, it should display the #dashboard again. So I set delay() between the add and remove of the standby-class. To see if it works I added the too long duration of 3sek.

But it doesn't delay! Why it don't? I don't see it...

share|improve this question
delay is used for queued items as animated elements, here, there is nothing to delay –  A. Wolff Jul 8 '13 at 8:50
possible duplicate of wait() or sleep() function in jquery? –  dTDesign Jul 8 '13 at 9:01
add comment

5 Answers

up vote 11 down vote accepted

delay will only work on actions that go through the animation pipeline, and won't have an influence on the timing of instant atomic operations like that. In order to delay things such as adding or removing classes, then you can use setTimeout.

the .delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue.

The .delay() method is best for delaying between queued jQuery effects. Because it is limited—it doesn't, for example, offer a way to cancel the delay—.delay() is not a replacement for JavaScript's native setTimeout function, which may be more appropriate for certain use cases.

share|improve this answer
add comment

The answer by Grant Thomas is perfect.

As the answer by madlee in my possible duplicate sais, there is a small project called jQuery wait()that provide a delay() like function for your task.

wait() or sleep() function in jQuery? answer #13351574

share|improve this answer
add comment

.delay() will only delay animations in jQuery. To set an actual delay, you might want to use setTimeout().

setTimeout(function() {
... do stuff ... 
}, 3000);
share|improve this answer
add comment

Seems like for what you are trying to do, you might want to take a look at CSS transitions:


You can still have .addClass(), except now your class will utilize these transition properties, and you won't need .delay().

share|improve this answer
add comment

Usually we need to do things before removing the standby state, so we remove the class in an ajax callback :

share|improve this answer
add comment

Your Answer


