jquery加载在加载的内容中不起作用

看到一些奇怪的行为，我完全不知所措。我有一个如下所示的索引页：

<nav>
<ul>
<li><a href="about.htm">About</a></li>
</nav>
<main><main>

<script>
$('nav li a').click(function(e){
e.preventDefault();
  $('main').load(this.href)
})
</script>

在about.htm中，我有以下内容：

<footer>
<a href="privacy.htm">Privacy</a>
</footer>

<script>
$('footer a').click(function(e){
e.preventDefault();
$('main').load(this.href)
})
</script>

---

单击导航中的“关于”链接时，About.htm会按预期加载到main中。但是当你点击页脚中的隐私链接时，它不会加载到主页面，而是加载一个新页面。脚本完全一样，为什么会这样？

我不完全理解这篇文章，但我认为这不是问题所在。如果我在我的索引页面中添加一个额外的div，并将页脚链接脚本更改为加载到该页面中，它就会工作。外部页面中包含的任何其他函数都可以正常工作，只是不是那个。就好像你不能从两个不同的地方把东西装进同一个容器一样。