Javascript jQuery加载其他html页面，但如何还原为原始内容

因此，我已经完成了这段jQuery代码，将html文件加载到一个DIV中，但我正在努力解决如何在加载的内容上放置一个后退按钮，一旦单击就会恢复到原始内容。有什么想法吗

理想情况下，我希望在加载内容时使用ajax效果，但在线阅读loasd是最好的方法吗

$('.load-page').on("click", function() {
  var href = $(this).attr("href");
  $('#in-the-news').load(href);
  return false
});

链接：

html:

原始内容

当用户按下链接时，您必须将原始内容缓存到另一个对象中，然后在用户按下原始链接时将其取回

像这样的东西（未经测试）

$（'.load page'）。在（“单击”，函数（）上）{
var href=$（this.attr（“href”）；
if（$（'#隐藏缓存'）.html（）=''）{
$（“#隐藏缓存”）.html（$（“#新闻中”）.html（）；
}
$（“#新闻中”）.load（href）；
返回错误
});
$（'.original page'）。在（“单击”，函数（）上）{
$（“#在新闻中”）.html（$（“#隐藏缓存”）.html（）；
返回错误
});
原始内容

作为一个选项，可能只存储

url

，因为页面大小可能会快速增长，用户不一定会使用它。您知道这是怎么做到的吗？对于这一点，您会看到，如果在其他文件内容中单击“上一步”按钮，或者最好将原始内容放在同一个opage上，那么这会起作用吗？嗯，我正在考虑将原始内容也放在它自己的文件中，如果这样做可以简化@lalborno所说的，或者创建另一个AJAX请求来获取“默认”页面数据。

<a href="/page-to-load-into-div" class="load-page">link</a>

<div id="in-the-news">
  <p>original content</p>
</div>

$('.load-page').on("click", function() {
  var href = $(this).attr("href");
  if ($('#hidden-cache').html() == ''){
      $('#hidden-cache').html($('#in-the-news').html());
  }
  $('#in-the-news').load(href);
  return false
});

$('.original-page').on("click", function() {
  $('#in-the-news').html($('#hidden-cache').html());
  return false
});


<div id="in-the-news" class="original-page">
  <p>original content</p>
</div>