Jquery onClick toggleClass：一次只有一个div

Question

我有一个菜单，我使用下面的jquery函数进行定位。问题是当单击并突出显示主页并且您想从那里跳转到产品时，两者都处于活动状态+块1和块2都显示。

我想要做的是，当用户点击A并从那里决定切换到B然后A处于非活动状态，依此类推。唯一一个保持不变的课程同时其中一个菜单项处于活动状态是＆＃34;内容删除＆＃34;。

我错过了什么？

$(document).ready(function() {
    $(".home").click(function() {
        $(this).toggleClass("item-active");
        $(".block-1").toggleClass("display");
        $(".b1").toggleClass("visibility");
        $(".content").toggleClass("content-removed");
    });
    $(".products").click(function() {
        $(this).toggleClass("item-active");
        $(".block-2").toggleClass("display");
        $(".b2").toggleClass("visibility");
        $(".content").toggleClass("content-removed");
    });
});

这里的HTML

  <div class="block-1">
  <div class="b1"><a href="#">Home</a></div>
    <div class="b1"><a href="#">About</a></div>
  </div>

    <div class="block-2">
  <div class="b2"><a href="#">Overview</a></div>
    <div class="b2"><a href="#">Health</a></div>
  </div>