Javascript forEach仅显示列表中的最后一项

我想显示列表中每个项目的一些数据。问题是该函数只显示关于最后一项的信息。 下面是函数的外观：

drivers.forEach(addLink);

function addLink(driver, index) {
  const nameList = document.getElementById('nameList');
  const driverImg = document.getElementById('driverImg');
  nameList.href = `?driver=${index}`;
  nameList.textContent = driver.name;
  driverImg.src = driver.image;
  driverImg.height = "45";
  list.appendChild(nameList);
  list.appendChild(driverImg);
 }

它在创建元素（const nameList=document.createElement（'a'）；）时工作，但我想将其更改为getElementById

html如下所示：

    <nav id="list">
       <a id="nameList"></a>
       <img id="driverImg">
    </nav>

---

您的函数被称为

addLink

，但它得到一个现有的元素（使用

getElementById

）并更改它。当您多次更改它时，最后一组更改就结束了

---

如果您想要创建所需的链接。

因为您实际上想要添加元素，您需要像以前一样创建它们，现在您只需要获得文档中allready的相同元素并更改其值（在每次迭代中覆盖上一次迭代的更改）