JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script src="http://jsplumb.org/js/jquery.jsPlumb-1.3.10-all.js"></script>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="Form1">
       
    <div class="main" style="height: 2000px"><table id="table1" cellpadding="2" border="1" cellspacing="2" class="maintable" style="left: 50px;
            top: 500px; position: absolute; width: 200px; height: 100px">
            <tr>
                <td>
                    <b>TABLE1</b>
                </td>
            </tr>
            <tr>
                <td>
                    <table id="table2" border="1" cellpadding="0" cellspacing="0" style="width: 100%">
                        <tr>
                            <td>
                                TABLE2
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                    <table id="table3" border="1" cellpadding="0" cellspacing="0" style="width: 100%">
                        <tr>
                            <td>
                                TABLE3
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                    <table id="table4" border="1" cellpadding="0" cellspacing="0" style="width: 100%">
                        <tr>
                            <td>
                                TABLE4
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
       ...

CSS

.connectorlabel {
        
        background-color:#F0F0F0;
        border:1px solid #000000;
        color:#000000;
        font-family:Arial;
        font-size:10px;
        padding:0.5em; 
        z-index:999;
    }

JavaScript

jsPlumb.ready(function () {

   jsPlumb.importDefaults({ Container: $("body")  });
                
   var $Circs = eval($("#hdnConnectors").val());
    
   jsPlumb.addEndpoint($Circs[0].EndpointA);            
});