w2ui框架中动态添加按钮的click事件监听未触发问题求助

我正在做一个使用w2ui组件的JavaScript前端项目，用了嵌套布局的结构，相关代码如下：

let layout = new w2layout(outerConfig.layout);
let grid = new w2grid(outerConfig.grid);
let formLayout = new w2layout(innerConfig.layout);
let form = new w2form(innerConfig.form);

layout.render('#ownskillsdiv');
layout.html('left', grid);
layout.html('main', formLayout);
formLayout.html('main', form);
formLayout.html('bottom', '<div id="ownskillsbuttoncontainer" style="width: 100%;"></div>');

我需要在formLayout的bottom区域里，根据表格选中的行动态添加或移除按钮，添加按钮的示例代码是这样的：

let ownSkillsButtonDiv = document.getElementById("ownskillsbuttondiv");

while(ownSkillsButtonDiv.childNodes[0] ) {
  ownSkillsButtonDiv.removeChild(ownSkillsButtonDiv.childNodes[0]);
}

let btn = document.createElement('button');
ownSkillsButtonDiv.append(btn);
btn.id = "ownskillformsave";
btn.innerText = "Save";
btn.className = "w2ui-btn";
btn.addEventListener("click", function() {
  console.log("Save");
});  

目前按钮的添加和移除都能正常工作，而且用document.getElementById()也能获取到这个按钮，说明它确实已经在DOM树里了，但点击按钮时，addEventListener的回调函数完全没触发——控制台根本不会打印"Save"。

想请教一下各位，这个问题可能出在哪里？我该怎么修复呢？谢谢大家！

备注：内容来源于stack exchange，提问作者Peter Horvath