如何删除列行值​使用jquery根据另一列从表中删除

Question

我有一个关于动态挂载表的问题。

所以我想知道如何编辑删除值的表​​根据值从行​​来自另一个带有jquery的列？例如，我有下表：

开始
2022年11月1日		2022年1月11日		2022年1月25日		2022年1月25日		2022年1月25日

function sumBalance(){
var table = document.getElementById("balanceTbl");
var tbody = table.tBodies[0];
var tr = table.tBodies[0].rows;
var totalBal = 0;
for(i=0; i < tr.length;i++){
var balance = tbody.rows[i].cells[2].children[0].value;
totalBal += Number(balance);
}
document.getElementById("total").innerHTML = totalBal;
}
sumBalance();
document.querySelectorAll("input[name=balance]").forEach(function(balanceElem,pos){
balanceElem.addEventListener("input",function(){
sumBalance();
})
})

table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}

<table id="balanceTbl">
<thead>
<tr>
<th>Start</th>
<th>End</th>
<th>balance</th>
<th>Trail</th>
<th>Id</th>
</tr>
</thead>
<tbody>
<tr>
<td>01/11/2022</td>
<td>01/15/2022</td>
<td><input type="text" name="balance" value="4" size="2"></td>
<td>high stretch</td>
<td>2</td>
</tr>
<tr>
<td>01/11/2022</td>
<td>01/15/2022</td>
<td><input type="text" name="balance" value="4" size="2"></td>
<td>low stretch</td>
<td>2</td>
</tr>
<tr>
<td>01/25/2022</td>
<td>01/30/2022</td>
<td><input type="text" name="balance" value="6" size="2"></td>
<td>high stretch</td>
<td>4</td>
</tr>
<tr>
<td>01/25/2022</td>
<td>01/30/2022</td>
<td><input type="text" name="balance" value="6" size="2"></td>
<td>inert stretch</td>
<td>4</td>
</tr>
<tr>
<td>01/25/2022</td>
<td>01/30/2022</td>
<td><input type="text" name="balance" value="6" size="2"></td>
<td>low stretch</td>
<td>4</td>
</tr>
</tbody>
<tfoot>
<td>Total</td>
<td></td>
<td id="total"></td>
<td></td>
<td></td>
</tfoot>
</table>

不要使用id，因为在HTML中，id在每个元素之间应该是唯一的，而不是使用名称或类来代替id。试着改变平衡，看看总数。希望这个样品能有所帮助。感谢