Javascript警报根本不显示

我有这个功能，我认为每当我的页面中的一个按钮被点击时，就会触发一个警报，但是什么也没有发生，如果我打开网页上的控制台，就不会显示错误。为什么

document.addEventListener('DOMContentLoaded' , () => {
         document.querySelectorAll('.new-button').forEach (button =>  {
                  button.onclick = () => {
                         const buttonName = button.innerHTML;
                         alert(`you have selected the button!  ${buttonName}`);
                  }

         });

});

---

如果有帮助的话，我正在使用ES6版本的JavaScript。

如果动态添加元素，则必须将

eventListener

附加到静态添加的某个祖先元素<代码>文档起作用，但您可以添加更具体的性能元素。此概念称为委托侦听器

document.addEventListener（'click'，函数（e）{
如果（e.target&&e.target.matches（'.new按钮'））{
const buttonName=e.target.innerHTML；
警报（`您已选择按钮！${buttonName}`）；
const newButton=document.createElement（'button'）；
newButton.classList.add（'new-button'）；
newButton.innerHTML='单击我！！'；
document.getElementById（'container'）.append（newButton）；
}
});

点击我！
console.log（）可能重复的@Virx OP表示没有错误，所以我怀疑这是重复的。在警报之前放一个console.log，检查是否打印了日志？我会添加
console.log（）
语句以确保“DOMContentLoaded”正在调用handler，并且该类的页面上实际上有一些按钮。我认为可能是重复的，因为我所说的按钮是通过编程方式添加的，它们不会像加载部分中的内容那样快速响应。如何将这些类型的按钮链接到事件侦听器？我修改了特定问题的答案。这是我添加按钮的方式：socket.on（'connect'，（）=>{document.querySelector（'add channel'）。onclick=function（）{var channel=prompt（“在此处输入新频道名称”）；if（channel！=null）{socket.emit（'newchannel opened'，{“channelName”：channel}）；}}}}）；socket.on（'channel added'，data=>{const newButton=document.createElement（'button'）；newButton.className=“new button btn btn dark”；newButton.innerHTML=data；document.querySelector（'#channels'）。appendChild（newButton）；}）；好的，这个答案中的代码是有效的！但是我不理解我的代码和你的代码之间的区别。onclick也是一个事件侦听器吗？编辑：我会查看代理侦听器，谢谢