Question

I’m trying the following in order to replace existing element with the message and after a short delay fade out the message, but for some reason I cannot get it to work:

$(this).replaceWith($(message).hide().fadeIn(300).delay(1000).fadeOut(300));

Any idea how to amend the above to achieve exactly this?

As requested – a bit more of the code surrounding the line above:

$('#form_id').fadeOut(300, function() {
     $(this).replaceWith($(message).hide().fadeIn(300).delay(1000).fadeOut(300));
});

Answer 1

Ok – I’ve spent quite a bit of time trying to solve this and have come up with a different solution – for anyone who will come across the same problem – here’s what I’ve done – simply using javascript setTimeout() function:

tar.closest('#form_id').fadeOut(300, function() {
    $(this).replaceWith($(message).hide().fadeIn(300, function() {
         var elem = $(this);
         setTimeout(function() { 
             elem.fadeOut(300);
         }, 1000);
    }));
});