.remove（）在.append（）jquery上工作不正常，第一行除外

在下面的代码中，它是一个发票管理系统，一个客户可以有多个订单。添加新行时，添加新项按钮工作正常，但在尝试删除新行时，只有删除第一行后，按钮才会被删除

这是表格的第一行

<tbody id="TableBody">
    <tr>
        <td style="width: 220px">
            <input type="text" class="form-control" name="Item" id="Item" placeholder="Nombre del producto" required autocomplete="off">
        </td>
        <td>
            <input type="number" name="QTV" min="1" name="QTV" id="QTV" class="form-control text-right" placeholder="00" required>
        </td>
        <td>
            <input step="2" type="number" class="form-control text-right" min="1" id="Rate" placeholder="0.00" readonly>
        </td>
        <td>
            <input step="any" id="Disc" name="Disc" type="number" min="0" name="" class="form-control text-right" placeholder="00">
        </td>
        <td>
            <input type="text" name="SubTotal" class="form-control text-right" id="Total" placeholder="Total" readonly>
        </td>
        <td>
            <button type="button" class="btn btn-danger" id="DelRow">Delete</button>
        </td>
    </tr>
</tbody>

---

感谢您的贡献。

使用

class

标识删除按钮，因为

id

在HTML中必须是唯一的：

  <button type="button" class="btn btn-danger DelRow">Delete</button>

$（'#AddNewItem'）。单击（函数（）{
$（'#表体'）。追加(`
删除
`);
});
$（“#TableBody”）。在（“click”、“.DelRow”上，函数（）{
$（this）.closest（'tr'）.remove（）；
});

删除
添加新的
您的ID不是唯一的，因此无效。deleteRow事件处理程序绑定在哪里？请为
DelRow
使用
类
，不是一个
id
@trincot，通过使用类它没有任何效果。@KevinB这意味着在每次追加时我都必须使用唯一的id？请解释一下为什么这个答案没有用？
$('#DelRow').click(function(){
    var rowCount = $('#TableBody tr').length;

        $("#TableBody").delegate("#DelRow", "click", function () {
            $(this).closest('tr').remove();
    });
});

  <button type="button" class="btn btn-danger DelRow">Delete</button>

$("#TableBody").on("click", ".DelRow", function () {
    $(this).closest('tr').remove();
});