js遍历table后如何实现如下的效果

这是我遍历的table
我对数据进行了固定，就是张三李四王五就显示在前3行，1,2,3就显示在后三行，
也就是说不管张三，李四，王五如何更换位置，只会在前三行显示，1，2,3不管如何更换位置，只会在后三行显示。
在通过ajax遍历出来数据后，我有单独对数字进行了小计

其中 红色方框内的数据，是我遍历完成后才添加上去的

这个是添加的代码

因为是我固定定死的一行数据，只能显示咋特定行，当张三 李四 王五 其中少一个的时候就会是这种结果

就是我如何让 数字的小计 显示在 王五 李四 和 1 2 3 之间， 不管他们谁减少不影响模板 不让红色方框内的数据定死

就是根据我数据的多少 ，保证格式不变

要如何修改代码中的某个部分

 function abc() {

        $.ajax({
            url: "/zd/ab",
            type: "POST",
            async:false,
            data:{},
            success: function (data){

                const citys=[       //排序
                    ['张三','李四','王五'],
                        ['1','2','3']
                ];
                function compare(data,citys){let sprtArr=[];let filters=[];
                citys.forEach(item =>{
                        let temArr=data.filter(c => item.includes(c.name))
                        temArr.sort((a,b)=>a.currentCount -b.currentCount)
                        filters.push(...item)
                        sprtArr.push(...temArr)
                    })
                    let baseArr=data.filter(c=>!filters.includes(c.name))
                    baseArr.splice(0,1,...sprtArr)
                    return baseArr
                };
                    const comResult=compare(data,citys); //排序
                $("#yinhang").html("");
                $("#yinhang").append("<tr id='test'><td>名字</td><td>量</td></tr>")
                $.each(comResult, function (i,gui){
                        $("#yinhang").append("<tr >" +
                        "<td  style='width: 200px;border: 1px solid black;'>"+gui.name+"</td>"
                        + "<td  style='width: 200px;border: 1px solid black;'>"+gui.currentCount+"</td></tr>");
                });
                $(function(){
                    var table=document.getElementById("yinhang");//获取table对象
                    var rows=table.rows;//获取行对象
                    var cells=table.cells;//获取列对象
                    var colums = table.rows[0].cells.length;//获取列数            //这里从列开始遍历，得到的就是每一列的数据
                    //如果从行开始遍历，得到的就是每行的数据
                    for(var j=0;j<colums-1;j++){
                        var shuju=0;
                        for(var i=4;i<rows.length;i++) {//从i=1第二行开始去掉表头，rows.length-1结束，去掉合计行
                            var a = parseInt(rows[i].cells[j].innerHTML.trim());//获取每一列的值
                          shuju=shuju+a;
                        }
                        $("#yinhang").find("tr:eq(3)").after(("<tr><td>数字的小计</td><td>"+shuju+"</td></tr>"));
                    }
                });
            }
        } );

    };

let insetNum;
// 16行
citys.forEach((item,index) =>{
let temArr=data.filter(c => item.includes(c.name))
if (index === 0) {
insetNum = temArr.length; // 数组citys第一个值(子数组)当前存在的个数
}
})
};
// 46行. 这里的insetNum为上面动态得到的citys中实际展示的个数
$("#yinhang").find("tr").eq(insetNum).after(("数字的小计"+shuju+""));

是否可以：
将渲染‘数字的小计’这一行的操作提到循环前，将其值那个单元的元素内容先置为空，
并用一个变量记录下这个暂时没有数据的元素，
然后进行你需要的循环，最后往元素里面填充计算得来的数据
这样子？