<ul class="e-ul e-boxes">
    <li class="e-options" data-value="1">January<span class="e-icon e-close" unselectable="on"></span></li>
    <li class="e-options" data-value="2">February<span class="e-icon e-close" unselectable="on"></span></li>
</ul>

function sortSelectedMonthText() {
        var mylist = $('#months_container ul.e-ul');
        var listItems = mylist.children('li').get();
        listItems.sort(function (a, b) {
            return $(a).data('value') - $(b).data('value');
        });


        $.each(listItems, function (idx, itm) {
            if (listItems.length > 4) {
                //more than 4 months selected: replace w abbreviated text
                var monthVal = $(itm).data('value');
                var monthName = monthNames[monthVal - 1];
                itm.innerHTML= itm.innerHTML.replace(monthName,monthName.substring(0,3));
            }
            mylist.append(itm);
        });
}