JSFiddle - React, Tailwind, and code Playground
HTML
<button>Sort</button>
<ul id="place-list">
<li id="0">Paris</li>
<li id="1">greece</li>
<li id="2">London</li>
</ul>
JavaScript
var $list = $('#place-list');
$('button').data('lastSort', 'asc').click(function() {
var $items = $list.children(), lastSort=$(this).data('lastSort');
var direction = lastSort=='asc' ? 'desc' : 'asc';
$(this).data('lastSort',direction);
$list.empty().append($items.sort(directionSort[direction]));
});
var directionSort = {
asc: function (a, b) {
return a.id < b.id ? -1 : 1;
},
desc: function (a, b) {
return a.id > b.id ? -1 : 1;
}
}