JSFiddle - React, Tailwind, and code Playground

HTML

<label draggable="true" ondragstart="drag(event)">i am new to JavaScript</label>
<p type="text" ondragover="allowDrop(event)" ondrop="drop(event)">i am a student and</p>

CSS

div{
    width:200px;
    height:200px;
    background-color:green;
}

JavaScript

drag = function(ev) {
    event.dataTransfer.setData("text", ev.target.innerText);
}

drop = function(ev) {
    ev.target.innerText = ev.target.innerText +" "+ event.dataTransfer.getData("Text");
}

allowDrop = function(ev) {
    ev.preventDefault();
}