JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>1</li>
    <li>2</li>
    <li class="afterthis">3</li>
    <li>4</li>    
    <li>5</li>    
</ul>
<br />
<div id="test"></div>

JavaScript

$(document).ready(function() {
    $(".afterthis").after("<ul><h1>Title</h1></ul>");
    
    $("#test").append("title</div><div>content");
});

/* Why does the output have the first end tag at the end??? see source from output */