JSFiddle - React, Tailwind, and code Playground

HTML

<div id='draggable'>
     AAAAAA
</div>

<div id='dropbox'>
     BBBBBB
</div>

CSS

#draggable {
    cursor: move;
}
#dropbox {
    width: 100px;
    height: 100px;
    background: gray;
}

JavaScript

$("#draggable").draggable({
    helper: "clone"
});
$("#dropbox").droppable({
    drop: function(event, ui) {
        $("<div></div>").text(ui.draggable.text()).appendTo(this);
    }
})