Anuj Shah
Anuj Shah

Reputation: 147

Removing a table row dynamically using jquery doesn't work

This Table is generating dynamically.

<table class='myTab' id='selectPlaceTable' border='1px'>
    <tr>
    <td>Something</td>
    <td>Something</td>
    <td>Something</td>
    <td><input type='button' class='buttonRmv' id='buttonRmv' value='+'</td>
    </tr>
 </table>

jquery Function

$(document).ready(function(){
    $(".buttonRmv").on('click',function(){
            $(this).parent().parent().remove();
        });
});

Upvotes: 0

Views: 617

Answers (4)

SimarjeetSingh Panghlia
SimarjeetSingh Panghlia

Reputation: 2200

Try this below code:

$(document).ready(function(){
    $('body').on('click',".buttonRmv",function(){
        $(this).closest('tr').remove();
    });
});

Upvotes: 0

areddy
areddy

Reputation: 67

Try this:

$(document).ready(function(){
    $('body').on('click',".buttonRmv",function(){
        $(this).closest('tr').remove();
    });
});

Upvotes: 0

I&#39;m Geeker
I&#39;m Geeker

Reputation: 4637

Use this

Check Demo

$(document).ready(function(){
    $(document.body).on('click',".buttonRmv",function(){
            $(this).parent().parent().remove();
    });
});

Upvotes: 2

Kartikeya Khosla
Kartikeya Khosla

Reputation: 18873

Since you are generating HTML dynamically use event delegation and .closest() as shown :-

$(document).ready(function(){
    $(document.body).on('click',".buttonRmv",function(){
        $(this).closest('tr').remove();
    });
});

Upvotes: 0

Related Questions