JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li id='e1'>e1</li>
<li id='e2'>e2</li>
<li id='e3'>e3</li>
<li id='e4' style="z-index:4">e4</li>
<li id='e5'>e5</li>
<ul>
CSS
#e1 {
z-index:1;
color:#000000;
}
#e2 {
z-index:2;
color:#000000;
}
#e3 {
z-index:3;
color:#000000;
}
#e4 {
z-index:4;
color:#FFFFFF;
}
#e5 {
z-index:5;
color:#000000;
}
JavaScript
var elem;
var elems = $("li");
for(var i=0; i<elems.length; i++) {
console.log($(elems[i]).css('color'));
if($(elems[i]).css('color') == '#FFFFFF') {
elem = elems[i]; //assign elem we found
break; //exit loop early
}
}
console.log($(elem).html());