JSFiddle - React, Tailwind, and code Playground

HTML

<div id='box'></div>
<div id='redBox'></div>

CSS

div#box {
    width:300px;
    height:300px;
    background-color:beige;
    border: 1px solid black;
}

div#redBox {
    width:100px;
    height:100px;
    background-color:red;
}

JavaScript

var cell_dropOps = {	 
	drop : box_drop,		
	accept : '#redBox',
    drop: function (event, ui) {
     $(this).append(ui.draggable);
        ui.draggable.css({ top: ui.offset.top, left: ui.offset.left});
    }
};

function box_drop(e, ui) {
   debugger;
     x=1;
    console.log(ui);
}

$(function(){  
    $('#box').droppable(cell_dropOps);
    $('#redBox').draggable();
});