¿Cómo eliminar el último DIV usando jQuery?

Question

Tengo el siguiente formato:

<div id="container1"> 
<div id="post"> blah blah blah </div> 
<div id="post"> blah blah blah </div> 
<div id="post"> blah blah blah </div> 
</div> 

<div id="container2"> 
<div id="post"> blah blah blah </div> 
<div id="post"> blah blah blah </div> 
<div id="post"> blah blah blah </div> 
</div> 

Quiero un código de jQuery para quitar el último "post" en el DIV "container1" con un efecto de desvanecimiento.

Importante: el "contenedor1" no tiene un número de DIV "post" especificado. por lo que el código debería simplemente seleccionar el último div "POST" en el div "contenedor1".

Gracias

Answer 1

$('#container1 #post:last').fadeOut() eliminaría el último div con el ID de "post" en "container1".

Además, como dijo Gumbo, las identificaciones deben ser únicas. Sin embargo, este código jQuery seguirá funcionando.

Answer 2

IDs must be unique in a document. Así que el selector #post probablemente no funcionará. Pero esto debería funcionar de todos modos:

$("#container1").children("div[id=post]:last").fadeOut(); 

Answer 3

Para afinar la sincronización fadeout puede utilizar en lugar de ocultar:

$(document).ready(function() { 
     $("#container2 div:last").hide(2000); 
    }); 

Answer 4

en lugar de .fadeout, se debe utilizar .Remove para eliminar el elemento de la div que contiene. Fadeout realiza la transición de desvanecimiento, sin embargo, el elemento permanece en el DOM y se contará si se manipula el tamaño del div.

Answer 5

$("#container1").children("div[id=post]:last").remove(); 

eliminará last div y así sucesivamente hasta que se eliminen todos los div.

Answer 6

Esto se desvanece hacia fuera y también lo elimina del DOM

$('#container1 #post:last').fadeOut('slow',function(){ 
    $(this).remove(); 
});