javascript - 我的 jQuery 克隆没有显示。如何从数组及其值动态填充 div？

Question

我正在尝试使用列表填充我的功能包装器。是的，我已经尝试过 getElementsByTag，但这只是复制了没有内容更改的节点。现在，我的隐藏样式节点显示在列表的顶部，然后只有数组中的前 4 个条目显示在 ui 中。

我的阵列

联邦税收抵免，1,240

州税收抵免，620

MassCEC 回扣，289

SMART（低于 25kW 交流电），24

净计量，16

我的输出

应该隐藏的虚拟节点，虚拟值

联邦税收抵免，1,240

州税收抵免，620

MassCEC 回扣，289

SMART（低于 25kW 交流电），24

const incentives_array = data.user.Incentives_Array;

incentives_array.forEach((incentive) => {

 console.log(incentive);
 style with the "Sample Card" class
             
 const benefit = document.getElementById('incentive');
 const clone = benefit.cloneNode(true);
                
 clone.setAttribute('id', '');
 clone.style.display = 'grid';
                
 const check = clone.getElementsByTagName('check-icon');
                check.src = "https://uploads-ssl.webflow.com/609831e7088fb22c2a678b09/60ca43b8a79f1ae728de8fbc_Check.svg";
                
 const benefit_name = document.getElementById('benefit-name');
                benefit_name.textContent = incentive.name;
                
 const benefit_price = document.getElementById('benefit-price');
 benefit_price.textContent = "+ " + formatter.format(incentive.value);
                
                
incentive_container.appendChild(clone);
                
                

 })

输出界面截图

标签： javascriptjquery