JSFiddle - React, Tailwind, and code Playground

HTML

<div id="listparent">
    <div id="content_id_1">
        <ul>
            <li> some text, not important for the reordering but it must move with it's parent div</li>
            <li> some text, not important for the reordering but it must move with it's parent div</li>
            <li>
                <div class='date--2011-11-11'>2011-11-11'</div> 
            </li>
        </ul>
    </div>
    <div id="content_id_2">
        <ul>
            <li> some text, not important for the reordering but it must move with it's parent div</li>
            <li> some text, not important for the reordering but it must move with it's parent div</li>
            <li>
                <div class='date--2011-10-10'>2011-10-10'</div> 
            </li>
        </ul>
    </div>

JavaScript

function sortDateASC(a, b) {
    var keya = new Date($(a).find('div[class^=date--]').text().replace("'", "")).getTime();
    var keyb = new Date($(b).find('div[class^=date--]').text().replace("'", "")).getTime();
    return keya > keyb ? 1 : keya < keyb ? -1 : 0;
}
$('div[class ^= date--]').each(function() {    $(this).closest("#listparent").children().sort(sortDateASC).appendTo("#listparent");
});