First of all, I renamed your Button1 to add your row to addRowButton , and then I changed the delegate method to be more specific to addRowButton, which is from
$('#lastYear').delegate('input[type="button"]'
To do this:
$('#lastYear')delegate('input[type="button"][id^="addRow"]'
Then inside the delegate method specifically after
$(this).attr('id', id);
After that, I add the following:
var checkid = $(this).attr('id').substring(0,id.length-1); if (checkid == 'deleteRowButto') // the 'deleteRowButto' is not a mistake { $(this).click(function() { $(this).closest("tr").remove(); // I assign an onclick for the delete button in order to remove a specific row }); }
Edit:
I made some improvements that, after deleting a line, the previous add button is displayed, so I add the code below:
var showmenow = $(this).closest("tr").prev().find("td:eq(5)").find("input[type='button']"); $(showmenow).show(); $(this).closest("tr").remove(); });
And instead of removing the button in the source code:
$(this).remove(); newIDSuffix++;
Instead, I use hide:
$(this).hide(); newIDSuffix++;
See the new jsfiddle I created.
source share