JSFiddle - React, Tailwind, and code Playground

HTML

<span>
    Сортировать по <a class="link1" href="#">возрастанию</a> | <a class="link2" href="#">убыванию</a></span>
<div id="container">
    <div class="blocks block-1" data-number="1">1</div>
    <div class="blocks block-2" data-number="2">2</div>
    <div class="blocks block-3" data-number="3">3</div>
    <div class="blocks block-4" data-number="4">4</div>
    <div class="blocks block-5" data-number="5">5</div>
    <div class="blocks block-6" data-number="6">6</div>
    <div class="blocks block-7" data-number="7">7</div>
    <div class="blocks block-8" data-number="8">8</div>
</div>

JavaScript

function sortUsingNestedText(parent, childSelector, _mode) {
	let mode = ['asc', 'desc'].includes(_mode) ? _mode : 'asc';
	let items = parent.children(childSelector).sort(function(a, b) {
        let vA = $(a).data('number');
        let vB = $(b).data('number');
        switch(mode){
        	case 'asc':
            	return (vA < vB) ? -1 : (vA > vB) ? 1 : 0;
                break;
        	case 'desc':
            	return (vA > vB) ? -1 : (vA < vB) ? 1 : 0;
                break;
        }
        
    });
    parent.append(items);
}

$(".link1").on('click', function(e){
	sortUsingNestedText($('#container'), "div", "asc");
});

$(".link2").on('click', function(e){
	sortUsingNestedText($('#container'), "div", "desc");
});