JSFiddle - React, Tailwind, and code Playground

CSS

div {
    width: 450px;
    height: 400px;
    background-color: #ccc;
    overflow: auto;
}
span {
    display: inline-block;
    width: 50px;
    height: 50px;
    background-color: #777;
    margin: 0 30px 30px 0;
}

JavaScript

$(function() {
    var wrapper = $("<div></div>")
    
    for (i = 0; i < 100; i++) {
        wrapper.append("<span></span>");
    }
            
    $("body").append(wrapper);
    
    color_rows();
});

function color_rows() {
    var lastTop = -1;
    var rowCount = 0;
    $("span").each(function(i) {
        var top = $(this).position().top;
        if (top != lastTop) {
            rowCount++;
            lastTop = top;
        }
        if(rowCount % 2 == 0)
        {
            $(this).css("background-color", "red");
        }
    });
}