Javascript 从JS添加span

为什么我的span仅适用于添加的第一个字母，并在第一个字母后停止按钮的功能。但是，如果我删除添加垃圾邮件标签，它在没有跨距的情况下可以正常工作`

 var letterContainer = document.querySelector(".letter-container");

 document.querySelector(".vow").addEventListener("click", pickFrom(letters));

 function pickFrom(letters) {

   // if the length of the letter container is less than 8
   if (letterContainer.innerHTML.length < 8) {

     //add letters to the letter container
     letterContainer.innerHTML += "<span>"+ rando(letters)+"</span>";

   }

var letterContainer=document.querySelector（“.letter container”）；
document.querySelector（“.vow”）.addEventListener（“单击”，从（字母）中选择）；
函数选取源（字母）{
//如果信件容器的长度小于8
if（letterContainer.innerHTML.length<8）{
//将字母添加到字母容器中
letterContainer.innerHTML+=“”+rando（字母）+“”；
}

试试这个：

var letterContainer=document.querySelector（“.letter container”）；
设currentLetters=[]；
函数选取源（字母）{
//或者如果你想使用你的原始状态而不引入状态
//letterContainer.innerHTML.length<（13*8+8）
//如果信件容器的长度小于8
如果（当前字母长度<8）{
//将字母添加到字母容器中
currentLetters.push（随机（字母））；
letterContainer.innerHTML=currentLetters.map（item=>`${item}`）。join（“”）；
}
}

辅音
元音

第一次运行后，您对条件有何期望：如果（letterContainer.innerHTML.length<8）选择了一个随机元音或辅音，并将其添加到字母容器中。我只想在每个字母周围添加一个方框形状/边框，就好像它在卡片上一样。是否希望只选择一次字母？如果没有，请删除条件：如果（letterContainer.innerHTML.length<8）{您是否可以使用或在此创建一个用于显示问题发生的完整代码。因为您没有在

pickFrom（letters）

中发布完整的代码，例如

rando（letters）

？