javascript - 要素のグループ内のアクティブな要素のスタイルを切り替えます

Question

target 属性のない要素のグループ (次のコードなど) が与えられた場合、以前に選択した要素の同じスタイリングを設定解除しながら、選択した要素のハイライト スタイリングを設定する最も効率的な方法は何ですか?

<div id="uno" class="element_parent">
    <a href="#" class="element">ONE</div>
</div>
<div id="dos" class="element_parent">
    <a href="#" class="element">ONE</div>
</div>
<div id="tres" class="element_parent">
    <a href="#" class="element">ONE</div>
</div>

Answer 1

次のように、アンカーをクリックしてクラスを追加および削除します。

$('.element').on('click', function(e) {
    e.preventDefault();
    $(this).addClass('active')
           .closest('div')
           .siblings('div')
           .find('a')
           .removeClass('active')
});

CSS

.active {color: red;} /* or whatever */

また：

$('.element').on('click', function(e) {
    e.preventDefault();
    $('.element.active').removeClass('active');
    $(this).addClass('active');
});

Answer 2

何かのようなもの：

$(".element").click(function() {
    $(".element").removeClass("active");
    $(this).addClass("active");
});