JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/start/jquery-ui.min.css">
<div id="wrapper"></div>

CSS

#wrapper {
    margin: 20px;
    position:relative;
}
.marker {
    background-color : #f00;
}
.ui-resizable-helper { border: 1px dotted gray; }

JavaScript

var marker = $("<div>");
marker.addClass( "marker" )
      .offset( { top:55, left: 66 } )
      .height( 41 )
      .width( 120 )
      .resizable( { animate: true,
                    handles: "e, w", 
                    start:function(event,ui){console.log(ui.originalPosition,ui.position);},
                    resize:function(event,ui){console.log(ui.originalPosition,ui.position);},
                    stop:function(event,ui){console.log(ui.originalPosition,ui.position);} 
                  } 
                );

$( "#wrapper" ).append( marker );