jQuery UI droppable でドロップされた要素を取得する

jQuery UI Draggable でドラッグ可能にした DOM エレメントを、
jQuery UI Droppable で取得することができます。
draggable 要素の属性として name などを設定しておき、
droppable 要素の drop イベントで属性を読み込むことで、
何がドロップされたのかを判断することができます。

<div class="drop">ココへドロップ</div>
<div class="drag" name="HELLO"></div>
<div class="drag" name="WORLD"></div>

// ドラッグ可能にする
$('.drag').draggable();

// ドロップ可能にする
$('.drop').droppable({
    drop: function(event, ui) {
        var name = ui.draggable.attr('name');
        alert(name + 'がドロップされました');
    }
});