How to fade out div slowly, update content, and then fade in div slowly, using jQuery?

Question

I have a div I want to fade out, update its content, and then fade back in. So far I have tried:

$(\'#myDivID\').fadeOut(\'slow\', function() {
         


        

Answer 1

Something like this would work:

$('#myDivID').fadeOut('slow', function() {
    $('#myDivID').replaceWith("
" + content + "
")
    $('#myDivID').hide().delay(2000).fadeIn('slow'); 
});

Test here: http://jsfiddle.net/tomgrohl/PgcTZ/

I've put the hide before the delay to make the animation work.