JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <span>Click a div!</span>
        <ul class="test">
<li>First div</li>
<li>Second div</li>
<li>Third div</li>

     
<li>Fourth div</li>
<li>Fith div</li>
<li>Sixth div</li>
        </ul>
 
</body>
</html>

CSS

.test li { background:yellow; margin:5px; }
span { color:red; }
.test {border: solid 1px red; clear:both; margin: 1em;}
.temp {clear:both;}

JavaScript

$("ul").after($("<p>").append($("<ul>").addClass('test')));

$("li:gt(" + ($("ul li").length / 2 - 1) + ")").appendTo("p ul");