Javascript 向新创建的DOM元素添加EventListener

嗨，我现在正在做一个小项目只是为了练习，但我遇到了这个问题。循环适用于硬编码代码，但不适用于动态类型代码

<button class='agree'>Add Like</button>

addlike

然后我有一个函数，可以在下面添加一些喜欢的东西

for(var i = 0; i < agreeBtn.length; i++) {
  agreeBtn[i].addEventListener('click', plusAgree)
}

function plusAgree (e) {
      let newNum =  Number(this.children[1].innerText) + 1;
      this.children[1].innerText = newNum;
}

for（变量i=0；i

此代码适用于硬编码的按钮元素。但是当我将它应用到我刚刚用createElement和innerHTML（动态类型）创建的新元素时，事件侦听器就不再工作了

    let newDiv = document.createElement('div');
    newDiv.className = 'boxshadow post-div grid-x';
    newDiv.innerHTML = `
    <div class="cell small-10">
          <h3 id='post-title'>${postContent.title}</h3>
          <p id='post-description'>${postContent.description}</p>
        </div>
        <div class="cell small-2 icon-div" id="icon-div">
          <button class='agree' id=${agreeId()}>
            <i class="fas fa-thumbs-up fa-3x"></i>
            <h5 class='agree-num'></h5>
          </button>

让newDiv=document.createElement（'div'）；
newDiv.className='boxshadow post div grid-x'；
newDiv.innerHTML=`
${postContent.title}
${postContent.description}

如何将动态输入的this更改为引用按钮，而不是全局对象？谢谢

---

此

引用全局对象，因为函数在全局范围内被调用

最好使用这里的方法

bind（）

方法创建一个新函数，该函数在调用时具有

将此

关键字设置为提供的值

以下是一个例子：

const agreeBtn=document.getElementsByClassName（“agree”）；
对于（变量i=0；i

同意按钮
“同意”按钮

如何将其应用于新创建的元素？方法与上面的相同。使用for循环。它没有在控制台中通知我，所以我尝试了console.log（this），它指向全局对象。请在呈现按钮的位置添加代码。而当我单击硬编码按钮时，它指向按钮itself@AngelChristyfor循环中的代码在一种情况下有效（正如您正确注意到的），但在另一种情况下不起作用。请在问题中补充这些案例之间的实际差异；仅仅笼统地描述这种差异是不够的。