I am using following code for animation using jquery. When I click on a list element, the corresponding div slides down and opacity goes to '1'. When I click other list element, the previous one goes up and fades, and the next one come down.

var id_prev;
 var id_new;
 $("#tag ul li ").click(function(event){
  var i = $(this).index()+1;
  var id_new="#person"+i;
  if(id_new != id_prev){
   $(id_prev).animate({top:'300px',opacity:'0'},500);
   $(id_prev).delay(200).css({'z-index':'0'});
   $(id_new).delay(200).css({'z-index':'300'});
   $(id_new).delay(200).animate({top:'300px',opacity:'0'},500);
   $(id_new).delay(200).animate({top:'330px',opacity:'1'},500);
   id_prev = id_new;
  }

});