JS不工作。引用正确，但不起作用

Question

http://mogswamp.com/testing/

点击“点击查看奖励”标题会使框下拉。我不知道出了什么问题。我一直在摆弄这一段时间，我不知所措。我真的很感激一些帮助。

<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script language="JavaScript" type="text/javascript" src="/testing/extend.js"></script>

extend.js

(function(){
  $('.incentives').hide();

  $('.incentives-click').on("click", function(){
    $('.incentives').fadeToggle();
  });
})();

如果您需要我提交任何其他内容，请询问，但应该很容易在页面来源中看到。感谢。

Answer 1

在脚本和/或页面完全加载之前，您的代码似乎正在执行。试试这个：

$(document).ready(function() {
  $('.incentives').hide();

  $('.incentives-click').on("click", function(){
    $('.incentives').fadeToggle();
  });
});

Answer 2

将您的javascript放在页面底部，而不是head，或者将其添加到后面添加的内容。尝试 event delegation ，或等待DOM ready