jQuery basic: ¿Cómo puedo eliminar una fila de la tabla cuando se hace clic en un botón de esta fila?

Question

$("#tableid tbody:last").append(html); 

Esto crea las filas de la tabla dinámicamente. Cada fila recién creada tiene un botón "eliminar".

Ahora, si hago clic en ese botón, se eliminará esa fila. ¿Cómo puedo hacer esto?

Gracias de antemano.

Answer 1

$(buttonSelector).live ('click', function() 
{ 
    $(this).closest ('tr').remove(); 
} 
); 

usando .live para vincular a su evento se unirá de forma automática cuando se añade dinámicamente su fila.

Editar

live ahora es obsoleto, desde la versión 1.7 que pienso.

El camino a seguir ahora es usar on en lugar de live.

$('#tableid').on('click', buttonSelector, function(){ 
    $(this).closest ('tr').remove(); 
}); 

Ver el doc.

Answer 2

Puede utilizar este código para eliminar la fila principal que contiene el botón de clic:

$(myButtonSelector).click(function(){ 
    $(this).parents('tr').first().remove(); 
}); 

Para un ejemplo vivo ver this link.

Para obtener más información, vea this article.

Answer 3

Se podría hacer algo como:

$('.add').click(function(){ 
$("#tableid tbody:last").append('<tr><td>Hi</td><td><a class="remove">Remove</a>'); 
}); 

$('.remove').live('click',function(){console.log($(this).parent().parent().remove())});