jQuery .on（'click'...）和.click（）导致问题

Question

我正在尝试执行以下Jquery：

$("button.publish").on("click", function(event) {
    alert("hello world");
}); 

在以下HTML上：

<button class="publish" data-id="<?= $article['id'] ?>">Publish</button>

但是代码不起作用，按钮不执行任何操作。在同一个脚本文件中，如果我执行等效的香草JS，并在按钮上单击onClick，则它会起作用（如下）

function showDetails(article) {
     alert("hello world");
}

我在完全相同的脚本文件中有更多的Jquery代码，它们以相同的方式使用.on（）函数，并且效果很好。谁能指出我出了什么问题？

我也尝试了以下方法：

$(document).ready(function() {
  $("button.publish").on("click", function(event) {
      alert("hello world");
  }); 
} 

https://jsfiddle.net/gay0n891/