Jquery点击某些页面上的事件代码，而不是其他页面

Question

我的网站的几个页面上有以下内容：

<section class="home-recent" id="read-more-articles">

</section>

<section class="read-more">

  <a href="javascript:void(0);" id="read-more-button" class="read-more-button">Read More</a>

</section>

然后，我的Jquery代码是：

$("#read-more-button").click(function () {
            $.ajax({
                url: SdsAjax.ajaxurl,
                data: ({action : 'get_more_articles', offset: offset}),
                success: function(data) {

                  $('#read-more-articles').append(data);
                    offset = offset + 24;
                }
            });

        });

这段代码很有用。现在由于某种原因，在主页上它不起作用，但在其他页面上它工作正常（字面上相同的代码）。我已经删除了其他jquery代码，并尝试将其隔离，并查看控制台。我没有看到任何错误。我无法弄清楚为什么在某些情况下这不会起作用，而在其他情况下则不然。我花了好几个小时试图诊断。

代码再次起作用。当我提出一个简单的警报（）;单击函数处理程序中的行，它不会在主页上点击。由于某种原因，点击事件不会被触发。在其他页面上，它会触发并执行警报代码。