在JavaScript/Jquery中从动态数组更新表头

这是我的更新函数，用于从选中的复选框收集的动态数组中更新表头，现在当我单击按钮调用此函数时，我想更新表头，但正在发生的事情是，新更新的数组元素附加了以前的头，单击按钮“我想根据新数组？更新表标题”？。如有需要，请要求澄清。跳过前3行，使用arr1作为数组来创建表头

    <script>
    function updateTable() {
    /*var arr1 = [];  //this is the array
    $.each($("input[name='cols']:checked"), function (){
        arr1.push($(this).val());
    });*/
    var arr1 = ["a", "b", "c", "d"];
    // First create thead section
    $('#dispTab').append('<thead><tr></tr></thead>');
    // Then create your head elements
    $thead = $('#dispTab > thead > tr:first');
    for (var i = 0, len = arr1.length; i < len; i++) {
        $thead.append('<th>'+arr1[i]+'</th>');
    }
    }
    </script>

函数updateTable（）{
/*var arr1=[]；//这是数组
$.each（$（“输入[name='cols']：选中”），函数（）{
arr1.push（$（this.val（））；
});*/
var arr1=[“a”、“b”、“c”、“d”]；
//首先创建thead部分
$（'#dispTab'）。追加（''）；
//然后创建头部元素
$thead=$（“#dispTab>thead>tr:first”）；
对于（变量i=0，len=arr1.length；i

尝试

html（）

而不是下面的

append（）

 $thead.find("th").eq(i).html(arr1[i]);

---

“如果需要，请要求澄清”-请阅读，以及如何创建。问题不清楚。。。您想要什么作为输出？所有数组元素都应该显示在thead中？？？@Mittal是的，这是必需的？？