JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="ul1" style="">
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
        <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>
    <li><a href="#"><span>jason markk</span></a></li>
    <li><a href="#"><span>Adidas</span></a></li>

    
</ul>

JavaScript

$("#ul1 li:nth-child(10n)").each(function(i){
    $(this).prevAll('li').andSelf().wrapAll($('<ul/>',{ id: 'ul'+(i+1)})) 
});
$('ul > ul').unwrap()