JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
<style type="text/css">
<!--
li {
   border:1px solid #000000;
} 
    
    div1 {
   border:1px solid #000000;
    padding:25px;
}
    .red {
    border:1px solid #ff0000;
    }
-->
</style>
        <script type="text/javascript">
            $(document).ready(function ust()
            {    
                $('#div1').sortable({
                    out: function(event, ui) { $('#nfo').append('OUT<br />'); }
                });
            
            });
        </script>
        
    </head>
    
    <body style="padding:55px;">
        <div id="nfo"> </div><hr /><br /><br />
       DIV 1 <div id="div1" class="myclass" ><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li><li class="lt">Drag me</li></div><br /><br />

    </body>
</html>