アクティブなクラスをメニューのセクションに追加

Question

そのセクションのリンクの1つがクリックされた場合、メニューのセクションに「アクティブ」クラスを追加しようとしています。最近、アクティブなクラス（jQueryを使用）をメニューのリンクに追加する方法（クリックされている場合）を学びました。私が望むものを得るためにこのコードを微調整できると思います。私はインスピレーションを与えるかもしれないので、下に掲載しました。

など。もしlil shortyがクリックされていれば、id = "section_3"のulを使ってアクティブクラスを取得します。導出関数をクリックすると、id = "section_2"のulを使用してアクティブなクラスを取得し、section_3を使用してアクティブなクラスを削除します。派生関数ページでは、セクション2にも「アクティブクラス」が必要です。

ご協力いただければ幸いです。私はあなたが（（親を探している）、または最寄りのだと思います

ジャック

$(function() { 
 
    var pgurl = window.location.href.substr(window.location.href 
 
        .lastIndexOf("/") + 1); 
 
    $(".section li a").each(function() { 
 
    var aurl = $(this).attr("href").substr($(this).attr("href") 
 
         .lastIndexOf("/")+1); 
 
    if (aurl == pgurl || aurl == '') 
 
     $(this).addClass("active"); 
 
    }) 
 
});

<div class="menu"> 
 
<ul class='section' id='section_2'> 
 
<li><span id='section_title_2' class='section_title'><a href='#' id='section_link_2'>Against the odds.</a></span> 
 
<ul> 
 
<li id='exhibit_1' class='exhibit_title'><a href="../against-the-odds/introduction"> &rarr; Introduction</a></li> 
 
<li id='exhibit_2' class='exhibit_title'><a href='../against-the-odds/deriving-functions'> &rarr; Deriving functions</a></li> 
 
<li id='exhibit_3' class='exhibit_title'><a href='../against-the-odds/exploiting-odds'> &rarr; Exploiting odds</a></li> 
 
</ul> 
 
</li> 
 
</ul> 
 
    
 
<ul class='section' id='section_3'> 
 
<li><span id='section_title_3' class='section_title'><a href='#' id='section_link_3'>Remembering everything.</a></span> 
 
<ul> 
 
<li id='exhibit_104' class='exhibit_title'><a href='#'>black swans</a></li> 
 
<li id='exhibit_104' class='exhibit_title'><a href='#'>lil shorty</a></li> 
 
</ul> 
 
</div>

Answer 1

）

$('li').click(function() { 
    $('.section').removeClass('active'); 
    $(this).closest('.section').addClass('active'); 
}); 

https://api.jquery.com/closest/

https://api.jquery.com/parent/