将 add/remove class 隔离到单击的项目

Question

目前我有一个手风琴菜单，每次点击 .responsive-accordion-head 我都会告诉它切换类如下：

$('.responsive-accordion-head').click(function () {

    if ( $( '.responsive-accordion-head i' ).hasClass( "plus-2" ) ) {

        $('.responsive-accordion-head i').removeClass("plus-2");
        $('.responsive-accordion-head i').addClass("minus-2");

    } else {
        $('.responsive-accordion-head i').removeClass("minus-2");
        $('.responsive-accordion-head i').addClass("plus-2");
    }

});

我遇到的问题是上面的代码更改了所有 .responsive-accordion-head 元素的类。我需要它仅特定于单击的项目。我该怎么做？

Answer 1

所有这些都可以简化为：

$('.responsive-accordion-head').click(function () {
    $(this).find('i').toggleClass('plus-2 minus-2');
});

将 add/remove class 隔离到单击的项目

Isolating add/remove class to clicked item

javascript

jquery

addclass

removeclass

toggleclass