fade out/fade in and roll up jquery effect

i have a list of items like so:

<ul>
<li><div>some super awesome html here</div></li>
<li><div>another awesome item here</div></li>

....

I'm looking for a nice effect to pop/remove the las开发者_如何学Pythont item on the list and add/fade in a new item on the top after an ajax call. anyone suggestions would be great. thanks.

EDIT: something more advanced than just simple fade in/out. i've seen it somewhere on the sites where there is a list of 5 items or so and a new item added to the list and old removed with a cool effect.

jQuery fadeOut()/fadeIn() should do the trick:

http://api.jquery.com/fadeOut/

http://api.jquery.com/fadeIn/

EDIT:

If you want something fancier, slideUp()/slideDown() provide basic sliding animations:

http://api.jquery.com/slideUp/

http://api.jquery.com/slideDown/

There also animate() if you want to add your own animations via changing CSS properties.

http://api.jquery.com/animate/