Jquery Draggable to rearrange divs

Jquery Draggable to rearrange divs

Looking to use .draggable to rearrange some divs on the page. I would like
it to snap into place and then have the other elements rearrange
themselves around it. Not really sure how to approach this. I was able to
get things .draggable() pretty easily as its one line of Jquery. Not
really sure where to go after that.
sample.
<form id="demo-upload" class="dropzone dz-clickable dz-started"
action="http://www.torrentplease.com/dropzone.php">
<div class="dz-default dz-message">
<div class="dz-preview dz-processing dz-image-preview dz-error"
onclick="myFunction()">
<div class="dz-preview dz-processing dz-image-preview dz-error"
onclick="myFunction()">
</div>
</form>
function moveDiv(div){
console.log('clicked');
$(div).draggable({ grid: [ 20,20 ] });
}