Search code examples
javascriptjquerydelaytiming

How to get timing & sequence right in jQuery


Assume we have three light bulbs, and I want to glow the first one, keep it on for a few milliseconds, turn it off, turn on the next and continue in the same way.

Turning the light bulbs on and off is done by adding and removing a class. How do I achieve this?

P.S. I used light bulbs just to make my question clearer. Basically what I need is, how to add a class to a div, keep it for some time, remove class, apply a class to another div, keep it for some time and remove it and so on...

*Edit Clarification: The number of bulbs is dynamic


Solution

  • You can use a simple combination of setInterval and jquery selecors Check this fiddle http://jsfiddle.net/aqXtL/1/