In my quest to iterate through a multidimensional array, I encountered the need to remove the class "list" from the divs within the array. However, there could be multiple divs with this class on my site.
My initial approach involved using two for-loops, but unfortunately, it was unsuccessful.
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>Exploring the possibility of using CSS and :not[], but unfortunately that approach did not yield the desired outcome as well.
.
.list:not(.first) {
border: 3px solid red; }