Javascript 在子元素上切换类（并删除同级）

我有下面的代码，用于通过切换

.active

类来创建手风琴效果。单击

.section header

，我将切换header和

.section content

上的类。这很有效

但是，如上所述，这是为了创建一个手风琴效果，它由多个

.accordion部分
标记组成。我需要调整jquery，以便从每个
.accordion部分
中删除所有
.active
类，而不是当前处于活动状态的部分。此时，单击
.section header
可在所有
.section content
标记上切换
.active
类

谢谢

HTML

<div class="accordion-section">
    <a class="section-header">
        <h3>Title</h3>
    </a>
    <div class="section-content">
        <div>Content</div>
    </div>
</div>

我们可以看一下你的渲染HTML吗？您的PHP与此问题无关。$（'.accordion section.section header'）。单击（function（）{$（this.addClass（'active'）；$（'.accordion section.section header'）。而不是（this.removeClass（'active'）；}）；您好@j08691-我已经编辑了这个问题，谢谢。我有以下内容，它对.section标题很有效，但是它需要工作才能在关闭所有其他内容的同时影响同一div中的.section内容$（'.section header'）。单击（function（）{$（this）.toggleClass（'active'）；$（'section header'）。非（this）.removeClass（'active'）；$（'section content'）。非（this）.removeClass（'active'）；}）；你好，谢谢你的帮助。我还需要切换当前部分。部分内容，有什么想法吗？您可以传递任意多个选择器，JQuery将找到与单个选择器匹配的所有元素。只需将
find
函数中的文本从
'.section header'
更改为
'.section header，.section content'
。您还需要将
.section content
设置为活动。我将编辑我的答案。对不起，最后一件事，当点击同一个手风琴部分时，这些类不会被删除以关闭该部分，这可以实现吗？谢谢不确定我更新答案时是否会通知您，但这应该是您需要的。
$('.accordion-section .section-header').click(function(){
    $(this).toggleClass('active');
    $(this).siblings().toggleClass('active');
});

$('.accordion-section .section-header').click(function(){
    // Check to see the initial state of the element
    var isActive = $(this).hasClass('active');

    // first remove the active class from all other section headers within this accordion section
    $('.accordion-section')
        .find('.section-header, .section-content')
            .removeClass('active');

    // Get the header and content for this section
    var sectionHeaderAndContent = $(this)
        .closest('.accordion-section')
            .find('.section-header, .section-content');

    // Toggle Active State: Set final active state based on state when clicked
    (isActive) ? sectionHeaderAndContent.removeClass('active'): sectionHeaderAndContent.addClass('active');
});