The problem is that list
doesn't get updated; once the first .after()
has taken place, it no longer is the last child; the elements are still added, but they remain invisible while you keep updating the already visible element from the first iteration.
You could update it like so:
var el = $('<li style="display:none;color:green;">' + rand() + '</li>')
list = el.insertAfter(list);
el.fadeIn();
// etc.