JSFiddle - React, Tailwind, and code Playground
HTML
<ul id="place-list">
<li id="4">
Tokyo
</li>
<li id="0">
Paris
<li id="5">
Frankfurt
</li>
</li>
<li id="2">
London
</li>
<li id="1">
greece
</li>
<li id="3">
Munich
</li>
</ul>
<div id="sort">Sort Me</div>
JavaScript
$("#sort").click(function(){
var sortedLis = [];
var lis = $("#place-list").find("li");
lis.remove();
var descending = $(lis[0]).attr("id") == lis.length-1;
lis.each(function(index, element){
if(!descending){
sortedLis[lis.length - $(element).attr("id")] = element;
}else{
sortedLis[$(element).attr("id")] = element;
}
});
$("#place-list").append(sortedLis);
});