JSFiddle - React, Tailwind, and code Playground

by Kelly Hawker

HTML

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<p>
<b>The Result</b>
</p>
<div class="main">

</div>
<script src="https://zauaedudamedia.blob.core.windows.net/dev/au_usefullinks.js"></script>

JavaScript

$(document).ready(function() {
  var $ul = $('<ul></ul>'); 
  getList(usefullinks, $ul);
  $ul.appendTo(".main");
});

function getList(item, $list) {

  var $sublist = $('<ul>');
  var $li = $('<li>');

  if ($.isArray(item)) {
    $.each(item, function(key, value) {
      getList(value, $list);
    });
    return;
  }

  if (item) {
    
    if (item.category) {
      $li.append($('<b>' + item.category + '</b>'));
    }

    if (item.text) {
      $li.append($('<a href="' + item.url + '">' + item.text + '</a>'));
    }

    if (item.links && item.links.length) {
      getList(item.links, $sublist);
      $li.append($sublist);
    }
    $list.append($li)
  }
}