jQueryクラスの追加と削除、ネストされたリストに別のクラスがある場合のCSS

Question

以下のようなHTMLコードブロックがあります。このコードを使用して

は

<ul>  
    <li class="level_1 has_sub no_active"> 
    <a href="">Window Rolling</a> 
    <ul class="level_2 has_sub no_active"> 
     <li class="level_2 no_sub no_active"><a href="">T52</a></li> 
     <li class="level_2 no_sub no_active"><a href="">T30</a></li> 
     <li class="level_2 no_sub no_active"><a href="">T57</a></li> 
     <li class="level_2 no_sub no_active"><a href="">T39</a></li> 
     <li class="level_2 no_sub no_active"><a href="">TE26</a></li> 
    </ul> 
    </li> 

    <li class="level_1 has_sub no_active"> 
    <a href="">Insulated And Extruded</a> 
    <ul class="level_2 has_sub no_active"> 
     <li class="level_2 no_sub no_active"><a href="">TE77</a></li> 
     <li class="level_2 no_sub no_active"><a href="">TE78</a></li> 
     <li class="level_2 no_sub no_active"><a href="">T77</a></li> 
     <li class="level_2 no_sub no_active"><a href="">TS77</a></li> 
    </ul> 
    </li> 

    <li class="level_1 no_sub no_active"><a href="">Grille Type Rolling</a></li> 
    <li class="level_1 no_sub no_active"><a href="">PVC High Speed Doors</a></li> 
    <li class="level_1 no_sub no_active"><a href="">Swinging doors</a></li> 
</ul> 

、私はul ul liがactive2という名前のクラスを持って確認する必要があります。そのクラスは、私は以下のようにその親要素にクラスを追加したいが存在する場合：

ul > li.active1 
ul ul.active1 and display: block; 

例：

<li class="level_1 has_sub active1"> 
    <a href="">Insulated And Extruded</a> 
    <ul class="level_2 has_sub active1" style="display: block;"> 
     <li class="level_2 no_sub active2"><a href="">TE77</a></li> 
     <li class="level_2 no_sub no_active"><a href="">TE78</a></li> 
     <li class="level_2 no_sub no_active"><a href="">T77</a></li> 
     <li class="level_2 no_sub no_active"><a href="">TS77</a></li> 
    </ul> 
    </li> 

私は以下のようにjqueryを使用して、それを試してみました。しかし、クラスとCSSはすべてliとulに追加されます。

if ($('ul li ul li').hasClass('active2')) { 
    $('ul li') 
    .removeClass('no_active') 
    .addClass("active1"); 

    $('ul li ul') 
    .removeClass('no_active') 
    .addClass("active1") 
    .css("display","block"); 
} 

誰でもこの問題を解決する方法を教えていただけますか？

ありがとうございます。

Answer 1

あなたはfilter

var removeClass = 'no_active', 
    addClass = 'active1'; 
$('ul ul li') 
    .filter(function() { 
     return $(this).hasClass('level_2'); 
    }) 
    .parent() 
    .removeClass(removeClass) 
    .addClass(addClass) 
    .parent() 
    .removeClass(removeClass) 
    .addClass(addClass);