How to display bunch of <li> elements consecutively using .animate

How to display bunch of <li> elements consecutively using .animate

I tried to enumerate through a index array to assign different ids to newly retrieved JSON data, the li element is initially set to be hidden and the hidden data can be seen from console. But the browser is failing to show the data when I tried to use ('li#a').animate({opacity: "show"}, "slow");
I also tried to use .animate right after each <li> appendTo the body and failed to show as well. I am wondering how to fix this?
Is there any better way of handling this with out creating an enumerating array?