Jquery create effect after load

I have this function:

 $(".delete").live('click', function() {
  var commentContainer = $(this).parent();
        var id = $(this).attr("id");            
        var string = 'id='+ id ;    
    $.ajax({   
       url: "<?php echo site_url('messages/delete') ?>",
       type: "POST",
       data: string,
       cache: false,
       success: function(){
          commentContainer.slideUp('600', function() {$(this).remove();
             $('.messages').fadeOut('2000', function(){$(this).remove();
                $('#messages').load("<?php echo site_url('messages/show') ?>", function(){
                    $(this).slideDown('2000');
                    deleteConfirmSetup(qst); // Add function call here
      开发者_开发知识库          });
            }); 
        });             
    } 
  });
  return false;
});

It is working up to a load. It is loading data, but there is no slideDown - data is suddenly presented. How to fix this?

You need to modify the following line in your code. Hide the element first the next method will apply the sliding effect and make it show as well.

    $('#messages').load("<?php echo site_url('messages/show') ?>", function(){
         $(this).hide().slideDown('2000'); //modify this
         deleteConfirmSetup(qst); // Add function call here
    });        

This line:

$(this).slideDown('2000');

should possibly be commentContainer.slideDown('2000');

I'm simply guessing using your ID names though if you could possibly clarify?