jQuery - Drag of elements in areas - then not draggable any more

I have three div areas. Creating an element, which is draggable() with jQuery UI, I can drag it all over the screen. Dropping it in a special area, then I can not drag it any more.

I created a full working demo: http://jsbin.com/enusu4/2/

There you can create a draggable element which is placed into the 开发者_StackOverflowleft green area. Dragging it to the middle or right green area, I can not drag the element.

I increment the zIndex of the elements, but it does not work.

Does anyone can help me, what's wrong?

Best Regards.

Add z-index:-1; for 2nd and 3rd divs.