JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="container">
    <div class="user" data-sortable="5210">
        <div class="text"> Jerry Smith </div>
        <div class="submenu"> ... </div>
    </div>
    <div class="user" data-sortable="5720">
        <div class="text"> Jerry Smith </div>
        <div class="submenu"> ... </div>
    </div>
    <div class="user" data-sortable="5914">
        <div class="text"> Jerry Smith </div>
        <div class="submenu"> ... </div>
    </div>
</div

JavaScript

var jsonResponse = [{
        name: 'Jerry Smith',
        sortID: '5341'
    }, {
        name: 'Jerry Smith',
        sortID: '6710'
    }

];

var initialCollection = [];
$('.user').each(function(ndx, elem){
    initialCollection.push($(elem).data('sortable'));
})
console.log(initialCollection)


$.each(jsonResponse, function(objNdx, obj) {
    var prevNdx = 0;
    var newCollection = [];
    $('.user').each(function(ndx, elem) {
        
        if (obj.sortID >= $(elem).data('sortable')) {
            prevNdx = ndx;
        }
    });
    var $newData = $('<div>', {
        'class': 'user',
        'data-sortable': obj.sortID
    }).append(
        $('<div>', {
            'class': 'text',
            'text': obj.name
        })
    ).append(
        $('<div>', {
            'class': 'submenu',
            'text': '...'
        })
    );
    $('.container').children('div.user').eq(prevNdx).after($newData);
    
    // display new collection purposes
    $('.user').each(function(ndx, elem){
    	newCollection.push($(elem).data('sortable'));
    })
    console.log(newCollection)
});