jQuery each() with a delay

Question

So, I would like an element to fade in and wait half a second, then fade the next in etc...

My code:

$('.comment').each(function() {                 
                    $(this).css({'opacity':0.0}).animate({
                        'opacity':1.0
                    }, 450).delay(500);
                });

I'm obviously doing something really silly.... (I hope)... My question is: Is this even possible? if not - can anyone point me in the right direction?

Thanking you!

Answer 1

Or, something like this:

$.each($('.comment'), function(i, el){

    $(el).css({'opacity':0});

    setTimeout(function(){
       $(el).animate({
        'opacity':1.0
       }, 450);
    },500 + ( i * 500 ));

});

demo => http://jsfiddle.net/steweb/9uS56/

Answer 2

try something like this

$(this).find('#results').children().each(function(index){
        $(this).delay(500 * index).slideDown(500);
})