eliminar nuevo div después de 5 segundos

Question

quiero agregar un div y después de 5 segundos eliminarlo. he intentado

$("#mainContentTD").prepend("<div style='color: #038a00; padding-bottom:10px;'>Your detailes where sucsesfuly... </div>").delay(5000).remove("this:first-child"); 

Answer 1

Puede utilizar setTimeout así:

setTimeout(function(){ 
    $('#divID').remove(); 
}, 5000); 

Los 5000 (ms) significa 5 segundos. Debe reemplazar divID con su propia identificación div/element.

Puede asegurarse de que el div existe en primer lugar utilizando length:

setTimeout(function(){ 
    if ($('#divID').length > 0) { 
    $('#divID').remove(); 
    } 
}, 5000) 

Answer 2

El método .delay() sólo funciona con los métodos que utilizan la cola de efecto estándar o una cola personalizada.

El método .delay() es el mejor para retrasar los efectos jQuery en cola. Debido a que es limitado, no ofrece, por ejemplo, una forma de cancelar el retraso, .delay() no reemplaza la función setTimeout nativa de JavaScript, que puede ser más apropiada para ciertos casos de uso.

Es decir, se puede o bien utilizar setTimeout(): (Demo)

var $elm = $("<div style='color: #038a00; padding-bottom:10px;'>Your detailes where sucsesfuly... </div>"); 
$("#mainContentTD").prepend($elm); 
setTimeout(function() { 
    $elm.remove(); 
}, 5000); 

O bien, se puede utilizar un método de efectos de eliminar al elemento: (Demo)

$("#mainContentTD") 
    .prepend("<div style='color: #038a00; padding-bottom:10px;'>Your detailes where sucsesfuly... </div>") 
    .children(':first') 
    .delay(5000) 
    .fadeOut(100);