JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>item-1
        <ul>
            <li>item-1.1</li>
        </ul>
    </li>
    <li>item-2
        <ul>
            <li>item-2.1</li>
            <li>item-2.2
                <ul>
                    <li>item-2.2.1</li>
                    <li>item-2.2.2</li>
                </ul>
            </li>
        </ul>
    </li>
    <li>item-3
        <ul>
            <li>item-3.1</li>
        </ul>
    </li>
    <li>item-4</li>
    <li>item-5</li>
</ul>

CSS

ul {
    margin-left: 16px;
}

JavaScript

$(document).ready(function() {
    recurseFetchListItems($("ul:first"))
        .appendTo("body").wrapAll("<ul>");
});

function recurseFetchListItems($ul)
{
    var $li = $ul.remove().children("li").remove();
    if ($li.length) {
        $li = $li.add(recurseFetchListItems(
                      $li.children("ul")));
    }
    return $li;
}