Selecting an element with JavaScript (z-index)-CodePudding

I want from among the boxes that I put in the code below; Select a box whose z-index is equal to 3 and make its background red to distinguish it from other boxes.

html:

 <ul>
        <li >
            <div >
                <h4 >title post1</h4>
            </div>
        </li>

        <li >
            <div >
                <h4 >title post2</h4>
            </div>
        </li>

        <li >
            <div >
                <h4 >title post3</h4>
            </div>
        </li>

        <li >
            <div >
                <h4 >title post4</h4>
            </div>
        </li>

        <li >
            <div >
                <h4 >title post5</h4>
            </div>
        </li>
    </ul>

For this purpose I wrote a script code that does not work. Please edit this code for me:

script:

$("li").each(function(){
var a=$(this).find("li");
$(this).css('z-index',3);
a.style.background= "red";
});

CodePudding user response：

This should work

$("li").each(function(index){//goes througth li elements
if($(this).css("z-index") == 3){//if zindex equals 3
  $(this).css("background-color","red");//set back ground to red
}
});