jQuery-UI Sortable List Drag

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/1.2.1/lodash.min.js"></script>
<div id="squads">
    <ul class="ulLeft">
        <li class="accordion">
             <h4 id="h4_ulLeft_squad_1">Squad 1 (4)</h4>

            <div>
                <ol squadnumber="1" class="olLeft olLeft_1">
                    <li>Barney</li>
                    <li>Betty</li>
                    <li>Fred</li>
                    <li>Wilma</li>
                </ol>
            </div>
        </li>
        <li class="accordion">
             <h4 id="h4_ulLeft_squad_2">Squad 2 (3)</h4>

            <div>
                <ol squadnumber="2" class="olLeft olLeft_2">
                    <li>Scooby</li>
                    <li>Shaggy</li>
                    <li>Thelma</li>
                </ol>
            </div>
        </li>
        <li class="accordion">
             <h4 id="h4_ulLeft_squad_3">Squad 3 (4)</h4>

            <div>
                <ol squadnumber="3" class="olLeft olLeft_3">
                    <li>Bart</li>
                    <li>Homer</li>
                    <li>Lisa</li>
                    <li>Marge</li>
                </ol>
            </div>
        </li>
    </ul>
    <ul class="ulRight">
        <li class="accordion">
             <h4 id="h4_ulRight_squad_1">Squad 1 (4)</h4>

            <div>
                <ol squadnumber="1" class="olRight olRight_1">
                    <li>Barney</li>
                    <li>Betty</li>
                    <li>Fred</li>
                    <li>Wilma</li>
                </ol>
            </div>
        </li>
        <li class="accordion">
             <h4 id="h4_ulRight_squad_2">Squad 2 (3)</h4>

            <div>
                <ol squadnumber="2" class="olRight olRight_2">
                   ...

CSS

#squads {
    width: 800px;
    margin: 0 auto;
    text-align: left;
}
.squadLabel {
    text-align: left;
}
#bottom {
    clear: both;
}
.ulLeft {
    width: 400px;
    float: left;
}
.ulRight {
    width: 400px;
    float: right;
}

JavaScript

$('.ulLeft, .ulRight').accordion({
    collapsible: true,
    heightStyle: 'content',
    active: 'none'
});

//
//  Gets called once by the source ('remove') side, and once by the destination
//  ('receive') side. First we resort the ordered list items (which isn't really
//  necessary for the remove side, but we'll fix that later), then we replace the
//  HTML content of this side with the sorted contents (this side is expanded, we
//  see all the elements in it), and then we update the list on the opposite (which
//  will only be visible if we're moving to the same squad). We need to do this so
//  if that squad is expanded later, it will have the same list content.
//
function updateList(thisOL, oppositeOL) {
    var squadNumber = thisOL.attr('squadnumber');
    var olNew = _.sortBy(thisOL.find('li'), function (li) {
        return $(li).text();
    });

    thisOL.html(olNew);
    $('.' + oppositeOL + '_' + squadNumber).html($(olNew).clone());

    if (thisOL.children().length == 0) {
        thisOL.height(10);
    }
    
    _.each(['ulLeft', 'ulRight'], function (side) {
        var ht = $('#h4_' + side + '_squad_' + squadNumber);
        var sn = ht.html().replace(/\(\d+\)/, '(' + olNew.length + ')');
        ht.html(sn);
    });
}

//
//  Create sortables, connect left list to right, right list to left
//
$('.olLeft').sortable({
    connectWith: '.olRight',
    cursor: 'move',
    receive: function (event, ui) {
        updateList($(this), 'olRight');
    },
    remove: function (event, ui) {
        updateList($(this), 'olRight');
        
        adsff
    }
});

$('.olRight').sortable({
    connectWith: '.olLeft',
    cursor: 'move',
    receive: function (event, ui) {
        updateList($(this), 'olLeft');
    },
    remove: function (event, ui) {
        updateList($(this), 'olLeft');
    }
});

$('.ulLeft, .ulRight, .olLeft, .olRight').disableSelection();