JSFiddle - React, Tailwind, and code Playground

by nikolya223

HTML

<div class="za-post-inner">
<h2 class="za-postheader">
<div class="za-postcontent">
<div class="za-article">
<div id="article-index">
<h3>Article Index</h3>
<ul id="MyUlNow">
    <li>1)Гомогенная среда мгновенно вызывает термодинамический Ганимед при любом агрегатном</li>
    <li>2)состоянии среды взаимодействия. Призма, по данным астрономических наблюдений</li>
    <li>3)Экситон прекрасно представляет собой элементарный апогей в полном соответствии с законом сохранения энергии</li>
    <li>4)Экситон растягивает случайный ионный хвост, как это случилось в 1994 году с кометой Шумейкеpов-Леви 9</li>
    <li>5)Плутон не входит в эту классификацию. Колебание оценивает экваториальный экситон – север вверху, восток слева</li>
    <li>6)Космический мусор существенно иллюстрирует непреложный перигей</li>
</ul>
    
    
</div>
</div>
<div class="za-article">
</div>
<div class="cleared"></div>
<div class="za-postfootericons za-metadata-icons">
</div>
<div class="cleared"></div>

CSS

#article-index>ul {
    overflow: hidden;
}
#article-index>ul>li {
    float: left;
    width: 45%;
    padding-right: 5%;
    margin-bottom: 10px;
}

JavaScript

var countLi = jQuery("#article-index>ul>li").length;
var LeftColumn="";
var RightColumn="";
for (i=0;i<countLi;i++){
    if (i<countLi/2){
        LeftColumn=LeftColumn+"<li>"+jQuery("#article-index>ul>li:eq("+i+")").html()+"</li>";
    }else{
    	RightColumn=RightColumn+"<li>"+jQuery("#article-index>ul>li:eq("+i+")").html()+"</li>";
    }
}
var NewOurLi="<li><ul>"+LeftColumn+"</ul></li><li><ul>"+RightColumn+"</ul></li>";
jQuery("#article-index>ul").html(NewOurLi);