JSFiddle - React, Tailwind, and code Playground

HTML

<ol>
    <li data-value="1">First</li>
    <li data-value="2">Second</li>
    <li data-value="4">Forth</li>
</ol>
<input id="addThird" type="button" value="Add Third" />

JavaScript

$(function() {
    $('#addThird').one('click', function() {
       $('ol').append('<li data-value="3">Third</li>');
        sortItems();
    });
    
    var sortItems = function() {
        var $items = $('ol li');
        $items.sort(function(a, b) {
            var keyA = $(a).data('value');
            var keyB = $(b).data('value');
            return (keyA > keyB) ? 1 : 0;
        });
        $.each($items, function(index, row){
            $('ol').append(row);
        });
    }    
});