JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://morrisonpitt.com/jsPlumbTest/js/1.3.5/jquery.jsPlumb-1.3.5-all.js"></script>
<div id="a">A</div>
<div id="b">B</div>

CSS

#a, #b {
    background-color: gray;
    height: 3em;
    position: absolute;
    width: 3em;
    z-index:100;
}

#a {
    top: 10%;
    left: 20%;
}
#b {
    top: 70%;
    right : 30%;
}

JavaScript

jsPlumb.ready(function() {
    var endPointParams = {
        anchor: [  'BottomCenter', 'RightMiddle' ]
    };
    
    jsPlumb.Defaults.Connector = [ 'Bezier', { curviness: 10 } ];
    jsPlumb.Defaults.RenderMode = 'canvas';
    
    var instance = jsPlumb.getInstance( jsPlumb.Defaults );
    
    var a = $( '#a' ),
        ae = instance.addEndpoint( a, endPointParams ),
        b = $( '#b' ),
        be = instance.addEndpoint( b, endPointParams );
            
    instance.draggable( $("#a, #b") );
    
    instance.connect({
        source: ae,
        target: be
    });
});