Jquery Puzzle with sortable, draggable & droppable

Question

I'm trying to build a little puzzle.
It's not necessary to use the lib's that i'm using.
If you try my fiddle: http://jsfiddle.net/fskwbrbb/
How can you drag Nr 3 to the top of the "dropzone" and under that put Nr2, but Nr1 on the side of Nr 1?

------|
   3  |
------|
----||---|
  2 || 1 |
----||---|

Answer 1

I've used Jquery Shapeshift for this.

JS

//Create new container
$('#btnAddContainer').on('click', function () {
//Container HTML setup
var containerHtml = $('<div class="container"></div>');

//Insert continer
$('.containers').append(containerHtml);

//Shapeshift
$('.container').shapeshift({
    enableDrag: true,
    enableCrossDrop: true,
    minColumns: 1
});
});

Check this fiddle for code:

https://jsfiddle.net/umcgqmwv/2/