0

I have a div called "live", it's a list of prepended items with Jquery :

<ul id="live">

</ul>

and items from an array :

$.each([ 'item1', 'item2', 'item3','item4','item5' ], function( index, value ) {
     $("#live").prepend('<li>' + this + '</li>').delay( 1000 ).fadeIn(1000);
});

But items are printed all together... how can I make this works ? :) (I tried setInterval but it did'nt work and delay does'nt seem to work too...)

Any ideas ??? :D

Victor Lebkowski
  • 57
  • 6
  • possible duplicate of [Fade in each element - one after another](http://stackoverflow.com/questions/379900/fade-in-each-element-one-after-another) – Andreas Aug 10 '15 at 15:41
  • Just out of curiosity: http://jsfiddle.net/rext08v8/ – Andreas Aug 10 '15 at 16:03

1 Answers1

0

Try,

var x = ['item1', 'item2', 'item3', 'item4', 'item5'];

insert(0);

function insert(cnt) {
    $("<li style='display:none'>" + x[cnt] + "</li>")
     .prependTo($("#live")).fadeIn("slow", function () {
     ++cnt;
     if (cnt < x.length){ insert(cnt); }
    });
}

DEMO

Rajaprabhu Aravindasamy
  • 66,513
  • 17
  • 101
  • 130