How To Fade Out And Remove A Div After Certain Time in jQuery

Tweet

Here’s a handy bit of code that I use often. Sometime you need to notify user about something and after some time it is needed to be removed. At such time, jQuery’s this snippet is sure shot work. Time after you have to remove is passed in milliseconds. For 1 second, you have to pass 1000. After that time, first fading out occurs followed by removing that from DOM.

jQuery(document).ready(function($){
 setTimeout(function() {
   $('#div-to-remove').fadeOut('slow',function(){
    $('#div-to-remove').remove(); 
   }); 
 }, 5000); 
});  

In this example, the div with id ‘div-to-remove’, will be faded out and removed in 5 seconds.