Recuperando objetos do DOM ordenados por um critério

by Bruno Nascimento

HTML

<div class="testGrid">
    <div class="test" data-gs-x="8" data-gs-y="4" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide"> 6</div>
    <div class="test" data-gs-x="0" data-gs-y="0" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide"> 1</div>
    <div class="test" data-gs-x="4" data-gs-y="4" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide"> 5</div>
    <div class="test" data-gs-x="8" data-gs-y="0" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide">3 </div>
    <div class="test" data-gs-x="0" data-gs-y="4" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide"> 4</div>
    <div class="test" data-gs-x="4" data-gs-y="0" data-gs-width="4" data-gs-height="4" class="grid-stack-item ui-draggable ui-resizable ui-resizable-autohide"> 2</div>

</div>

JavaScript

var $obj = $('.testGrid');

$obj.find('.test').sort(function (a, b) {
    return a.dataset.gsX - b.dataset.gsX;
})
.sort(function (a, b) {
    return a.dataset.gsY - b.dataset.gsY;
})
.appendTo( $obj );