jQuery: o que é necessário para remover o mais próximo com o botão Clique no

Question

Eu tenho uma tabela HTML com uma linha e vários TRs que são adicionados dinamicamente. Cada TR tem um botão na última coluna.

O que eu preciso para que clique no botão o TR mais próximo seja removido da tabela? Eu tentei usar $(this).closest.remove() Mas isso não funcionou, então presumo que preciso adicionar IDs ou outra coisa aqui.

Uma tabela de exemplo básica seria o seguinte:

<table class='tableClass'>
    <tbody>
        <th>
            <td>Text</td><td>Text</td><td>Text</td>
        </th>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
        <tr>
            <td>Text</td><td>Text</td><td><button type='button' class='btnClass'>Delete</button></td>
        </tr>
    </tbody>
</table>

Answer 1

Você precisa dar o closest função um seletor. Experimente isso:

$('.btnClass').click(function() {
    $(this).closest('tr').remove();
});

Além disso, seu HTML é inválido como th deve ser filho de tr:

<table class='tableClass'>
    <tbody>
        <tr>
            <th>Text</th>
            <th>Text</th>
            <th>Text</th>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
        <tr>
            <td>Text</td>
            <td>Text</td>
            <td>
                <button type='button' class='btnClass'>Delete</button>
            </td>
        </tr>
    </tbody>
</table>

Exemplo de violino

Answer 2

Você pode fazer isso usando .closest( selector ) adequadamente como:

$(this).closest('tr').remove();

Na verdade, em seu código:

$(this).closest.remove()
            ___^___

Você está perdendo a abertura e o fechamento parênteses () e o seletor tr.

Answer 3

http://jsfiddle.net/cpvh9/

$(".btnClass").click(function(){
        $(this).parents('tr').remove();
    });

Answer 4

Do seu código html, parece que você deseja remover o pai, tente isso

$(".btnClass").click(function(){
    $(this).parents("tr:first").remove();
});