关闭div时的removeClass()

Question

当一个单独的div关闭时，我很难从元素中删除一个类。

从下面的代码和我的小提琴中可以看到

我有一个jquery选项卡菜单，从默认情况下不打开开始。单击选项卡时，内容将被打开并突出显示该选项卡。但是，如果再次单击该选项卡并关闭该选项卡，则该选项卡将保持高亮显示。

我试过removeClass，但没有成功。

JS

$(document).ready(function() {
  $(".tabs-menu a").click(function(event) {
    event.preventDefault();
    $(this).parent().addClass("current");
    $(this).parent().siblings().removeClass("current");
    var tab = $(this).attr("href");
    $(".tab-content").not(tab).css("display", "none");
    $(tab).slideToggle();
  });
});

HTML

<div id="tabs-container">
  <div class="tabs-menu">
    <div><a href="#tab-1">One</a></div>
    <div><a href="#tab-2">Two</a></div>
    <div><a href="#tab-3">Three</a></div>
    <div><a href="#tab-4">Four</a></div>
  </div>
  <div class="tab">
    <div id="tab-1" class="tab-content">
      Hello
    </div>
    <div id="tab-2" class="tab-content">
      Number Two
    </div>
    <div id="tab-3" class="tab-content">
      Tab 3
    </div>
    <div id="tab-4" class="tab-content">
      Bye
    </div>
  </div>
</div>

Answer 1

使用toggleClass函数添加/删除类

 $(this).parent().toggleClass("current");

演示：http://jsfiddle.net/Us8uc/6747/