JSFiddle - React, Tailwind, and code Playground

by lustre

HTML

<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="clear downloadPadder1"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="clear downloadPadder2"></div>
<iframe name="ipopup" id="ipopup" class="listhider" scrolling="no"></iframe>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="clear downloadPadder3"></div>

CSS

.item {
    float:left;
    background:red;
    width:40px;
    height:40px;
    margin:10px;
}

.clear {
    clear:both;
}

#ipopup {
    display:block;
    width:300px;
}

JavaScript

jQuery('.item').each(function () {
    console.log(jQuery(this).nextAll('.clear').first().attr('class'));
    
    if((jQuery(this).nextAll('#ipopup').first().attr('class')) == "listhider") {
        console.log('before');
    } else {
        console.log('after');
        jQuery(this).css('background','blue');
    }
    //console.log(jQuery(this).nextAll('#ipopup').first().attr('class'));
});