JSFiddle - React, Tailwind, and code Playground

HTML

<ul>

<li>
   <a href="#">B Link</a>
   <ul class="sub-cat-list">
      <li>
         <a href="#">X sub link </a>
         <ul class="sub-cat-list">
            <li><a href="#">A Sub sub link</a></li>
            <li><a href="#">C sub sub link</a></li>
            <li><a href="#">D sub sub link</a></li>
            <li><a href="#">X sub sub link</a></li>
         </ul>
      </li>
   </ul>
</li>

<li>
   <a href="#">A Link</a>
   <ul class="sub-cat-list">
      <li>
         <a href="#">H sub link </a>
         <ul class="sub-cat-list">
            <li><a href="#">X Sub sub link</a></li>
            <li><a href="#">D sub sub link</a></li>
            <li><a href="#">F sub sub link</a></li>
            <li><a href="#">Z sub sub link</a></li>
         </ul>
      </li>
      <li>
         <a href="#">B sub link </a>
         <ul class="sub-cat-list">
            <li><a href="#">V Sub sub link</a></li>
            <li><a href="#">J sub sub link</a></li>
            <li><a href="#">O sub sub link</a></li>
            <li><a href="#">U sub sub link</a></li>
         </ul>
      </li>
   </ul>
</li>

<li>
   <a href="#">X Link</a>
   <ul class="sub-cat-list">
      <li>
         <a href="#">C sub link </a>
         <ul class="sub-cat-list">
            <li><a href="#">L Sub sub link</a></li>
            <li><a href="#">O sub sub link</a></li>
            <li><a href="#">Y sub sub link</a></li>
            <li><a href="#">Y sub sub link</a></li>
         </ul>
      </li>
      <li>
         <a href="#">A sub link </a>
         <ul class="sub-cat-list">
            <li><a href="#">G Sub sub link</a></li>
            <li><a href="#">T sub sub link</a></li>
            <li><a href="#">R sub sub link</a></li>
            <li><a href="#">A sub sub link</a></li>
         </ul>
      </li>
   </ul>
</li>

</ul>

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").each(function(){
    $(this).sortList();
})