Delayed jQuery addClass interval

Change the class on an element on a timed interval

by Mitty

HTML

<div class="one">&nbsp;<br />&nbsp;</div>
<div class="one">&nbsp;<br />&nbsp;</div>
<div class="one">&nbsp;<br />&nbsp;</div>
<div class="one">&nbsp;<br />&nbsp;</div>
<div class="one">&nbsp;<br />&nbsp;</div>

CSS

.one {background: orange; margin-bottom: 20px;}
.two {background: pink;}

JavaScript

$(function(){
    var i = 0;
    var length = $('.one').length;
    var delay = 1000;
    
    function delayClassChange() {
        setTimeout(function(){
        	if($('.one:eq('+ i +')').hasClass('two')) {
						alert("hi")
					} 
            $('.one:eq('+ i +')').addClass('two');
            i++;
            if (i == length) {return false;}
            delayClassChange();
        }, delay);
    }
    delayClassChange();
})()