Question

I’m doing a dynamic table to collect passengers personal data.
This table have above a control to add more rows at the end, every row is a copy of the first one, and that one have as last element a link that I use as a control for deleting that row.

The problem is that just the first row, the one that is not created dynamically, is the only one that is actually working and it’s capable of removing itself.

So the page even stop creating new rows due to the lack of the initial row (but that’s another issue xD).

This is the code I use to delete the row:

$('.remove').on("click",function(event){
    event.preventDefault;
    $(this).parent().parent().remove();

    //alert(str);
    newRowNum -= 1;
});

and here is the live site if you want need to chek it out:
http://www.micontrol.cl/~mvargas/wordpress/wp-transatacama/reservas-rapidas/tabladinamica.php

Answer 1

.on() events are only bound to elements that are initially in the DOM with its default syntax. See the documentation for it. You need to have a second selector if you want to delegate the event to other elements.