JSFiddle - React, Tailwind, and code Playground

by kritya

HTML

<div class="drag" id="mm">Drag me.
</div>
<div class="drop">Drop me
</div>

<div class="get">Get</div>

CSS

.drag {
    display:block;
    height:50px;
    background:yellow;
    margin:30px;
}
.drop {
    display:block;
    height:500px;
    background:black;
    color:white;
}

JavaScript

var ar= new Array();
$(".drag").draggable({revert:'valid'});
$('.drop').droppable({
    accept: '.drag',
    drop: function(event, ui) {
        //$(ui.draggable).remove()
        alert('Hush');
        ar.push(($(ui.draggable).attr('id')));
    }
});
$('.get').click(function() {
    $(this).html(ar[0]);
})