JSFiddle - React, Tailwind, and code Playground

by Ashish Mishra

HTML

<input type="button" id="object1" value="create">
<div class='demo'></div>

JavaScript

$('#object1')
	    	.click(function(){
		    	var htmlData='<div id="'+$.count+'" class="draggable ui-widget-content ui-draggable" style="height:100px; width:100px;border:1px solid #000;';
					htmlData += '"';
                htmlData += '><div style="color:black;">Object</div><div id="pos'+$.count+'X"></div><div id="pos'+$.count+'Y"></div></div>';
 $('.demo').append(htmlData);
                
                
           
     $(".draggable")
    .draggable()
    .click(function(){
        if ( $(this).is('.ui-draggable-dragging') ) {
            return;
        }
        $(this).draggable( "option", "disabled", true );
        $(this).attr('contenteditable','true');
    })
    .blur(function(){
        $(this).draggable( 'option', 'disabled', false);
        $(this).attr('contenteditable','false');
    });
            });