JSFiddle - React, Tailwind, and code Playground

HTML

<div>
Some text
</div>
<div class="dropArea">
Drop area
</div>

CSS

div {
    height: 100px; border: solid 1px #ddd;
}

JavaScript

var selected_text;

$(document).bind({
    dragstart:function(e) {
        selected_text = window.getSelection().toString();
        $(".dropArea").css("cursor", "help");
    },
    dragend:function(e) {
        $(".dropArea").css("cursor", "default"); 
    }
});

$(".dropArea").bind({
    dragover:function(e) {
        $(this).css("background-color", "green");
        return false;
    },
    dragleave:function(e) {
        $(this).css("background-color", "transparent");
        return false;
    },
    drop:function(e) {
        $(this).css("background-color", "transparent");
        alert(selected_text);
        return false;                
    }
});