JQuery-Schleife durch multidimensionales Array

Question

Ich versuche, ein mehrdimensionales Array zu durchlaufen. Ich möchte die Klasse "Liste" entfernen, wenn es in einem der div in meinem Array ist. Aber es ist möglich, dass es auf dieser Seite mehr als nur ein Div mit dieser Klasse gibt.

Also habe ich versucht, das mit zwei for-Schleifen zu lösen, aber ich habe es nicht funktioniert.

const $lists = [ 
 
       $('.first'), 
 
       $('.third') 
 
      ]; 
 

 
var i, j; 
 
for (i = 0; i < $lists.length; i++) { 
 
    for (j = 0; j < $lists[i].length; j++){ 
 
     $lists[i][j].find(.list).removeClass(list); 
 
    } 
 
}

.list { 
 
    background: green; 
 
}

<div class="first"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="first"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="second"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="third"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div>

Ich versuchte es auch mit CSS und: nicht []. Aber das hat auch nicht funktioniert.

.

.list:not(.first) { 
    border: 3px solid red; } 

Answer 1

die ausgewählten divs durch jQuery.merge() Anwendung von einem Mähdrescher, alle Artikel finden, die die .list Klasse enthält, und entfernen Sie sie:

Und wenn Sie es nur aus ersten und dritten entfernen möchten:

var $lists = [ 
 
    $('.first'), 
 
    $('.third') 
 
]; 
 

 
$($.merge.apply([], $lists)).find('.list').removeClass('list');

.list { 
 
    background: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="first"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="second"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="third"> 
 
    <ul class="list"> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div>

Answer 2

$(document).ready(function(){ 
 
$(".second").not(".first, .third").addClass("list") 
 
});

.list { 
 
    background: green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<div class="first"> 
 
    <ul> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="second"> 
 
    <ul> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div> 
 

 
<div class="third"> 
 
    <ul> 
 
    <li>foo</li> 
 
    <li>fooooo</li> 
 
    <li>bar</li> 
 
    </ul> 
 
</div>