如何使用javascript显示和隐藏两个不同的div？

我尝试使用在这个网站上找到的一些javascript来显示和隐藏两个不同的div。基本上，当有人点击到达按钮或点击“按钮”时，我希望AAA div显示在下面。当有人单击“b按钮”时，我想隐藏AAA div并在下面显示BBB div

我曾想过使用引导折叠，但不想要动画

我做错了什么

//单击即可设置内容
$（'.button'）。单击（函数（e）{
e、 预防默认值（）；
setContent（$（this））；
});
//设置加载内容
$（'.button.active'）。长度和设置内容（$（'.button.active'））；
函数setContent（$el）{
$（'.button'）.removeClass（'active'）；
$（'.container'）.hide（）；
$el.addClass（“活动”）；
$（$el.data（'rel'））.show（）；
}




AAA
BBB

---

假设已加载jQuery，则只需使用单击处理程序和show（）hide（）函数即可

$(".a-button").click(() => {
  $("#foo").hide()
  $("#bar").show()
});

$(".b-button").click(() => {
  $("#bar").hide()
  $("#foo").show()
});

---

我做错了什么？

首先，您没有在问题中发布任何代码本身，也没有在浏览器开发人员工具控制台中发布任何错误。。。比如

ReferenceError:$未定义

例如？加载

jQuery 3.1.0

和

1.11.3

看起来也不对。。。而且，在加载jquery之前加载

js/timeentries.js

——这依赖于jquery——可能是页面中最大的错误现在不需要代码——问题是加载javascript的顺序。。。加载两个截然不同的jQuery版本只会以眼泪告终

$(".a-button").click(() => {
  $("#foo").hide()
  $("#bar").show()
});

$(".b-button").click(() => {
  $("#bar").hide()
  $("#foo").show()
});