JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
       <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

CSS

ul li {
   display:inline-block;
    margin: 5px;
    padding:10px;
    border: 1px solid #888;
    height: 30px;
}

JavaScript

function calculateLIsInRow() {
    var lisInRow = 0;
    $('ul li').each(function() {
        if($(this).prev().length > 0) {
            if($(this).position().top != $(this).prev().position().top) return false;
            lisInRow++;
        }
        else {
            lisInRow++;   
        }
    });   
    $("ul li").css("background","#ffffff");
   for(i=lisInRow; i<=$('ul li').length; i=i+lisInRow)
   {
       $("ul li:nth-child("+i+")").css("background","green");
   }
    $("ul li:last-child").css("background","green"); 
}

calculateLIsInRow();

$(window).resize(calculateLIsInRow);