JSFiddle - React, Tailwind, and code Playground

HTML

<div id='cssmenu'>
<ul>
    
   <li><a href='#'><span>Products</span></a>
      <ul>
         <li><a href='#'><span>B Product 1</span></a>
            <ul>
               <li><a href='#'><span>Many Sub Product</span></a>
                            <ul>
               <li><a href='#'><span>CSub Product</span></a></li>
                <li><a href='#'><span>ASub Product</span></a></li>
                <li><a href='#'><span>BSub Product</span></a></li>
                <li><a href='#'><span>Xub Product</span></a></li>
                <li><a href='#'><span>Wub Product</span></a></li>
                <li><a href='#'><span>Hub Product</span></a></li>
                <li><a href='#'><span>Jub Product</span></a></li>
                <li><a href='#'><span>MSub Product</span></a></li>
                <li><a href='#'><span>LSub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a href='#'><span>Sub Product</span></a></li>
                <li><a...

JavaScript

$.fn.sortList = function() {
    var mylist = $(this);
    var listitems = $('li', mylist).get();
    listitems.sort(function(a, b) {
        var compA = $(a).text().toUpperCase();
        var compB = $(b).text().toUpperCase();
        return (compA < compB) ? -1 : 1;
});
$.each(listitems, function(i, itm) {
        mylist.append(itm);
    });
}

$("ul.sub-cat-list >li >ul").each(function(){
    $(this).sortList();
    })