JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="foo">
        <div>
            <ul>
                <li>
                    <div> <a href="#">Link 1</a>

                    </div>
                </li>
            </ul>
        </div>
    </li>
</ul>
<ul>
    <li class="foo">
        <div>
            <ul>
                <li>
                    <div> <a href="#">Link 2</a>

                    </div>
                </li>
            </ul>
        </div>
    </li>
</ul>
<ul>
    <li class="foo">
        <div>
            <ul>
                <li>
                    <div> <a href="#">Link 3</a>

                    </div>
                </li>
            </ul>
        </div>
    </li>
</ul>
<ul>
    <li class="foo">
        <div>
            <ul>
                <li>
                    <div> <a href="#">Link 4</a>

                    </div>
                </li>
            </ul>
        </div>
    </li>
</ul>

JavaScript

$(".foo a")
.each(function() {
  $(this).prependTo($(this).parents(".foo").empty());
})