javascript - 如何在多个元素上但不同时使用 toggleClass

Question

所以我遇到的问题很简单。我有一个跨度 <span class=""spDetails>Show More</span>使用此元素，我正在扩展一个部分以显示更多文本。

我遇到的问题是我想在页面的其他部分使用此功能。

这是我用来激活 toggleClass 的 jquery 代码。

$(".spDetails").click(function() {
  $(".divFees").toggleClass("feesActive");
});

我的问题是:我不想为每个使用此切换的元素编写这行代码，有没有办法为具有不同类名或 ID 的多个元素创建此代码？谢谢。

好的，这是我的 HTML:(简化版!)

<div id="optionOne" class="elementOne">
     <div class="divFees">
         <p>Text Text</p>
     </div>
     <span class="showMore">Show More</span>
</div>

<div id="optionTwo" class="elementTwo">
     <div class="divFees">
         <p>Text Text</p>
     </div>
     <span class="showMore">Show More</span>
</div>

我正在尝试隐藏和显示 <div class="divFees"></div>只有当有 child 的时候<span>被点击。

Answer 1

您可以使用 , 在选择器中附加您想要的元素。

$(".divFees , .otherOnes , #otherOneWithId").toggleClass("feesActive");