JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
<head>
    <title>bug</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>
    <style>
        a { color: inherit; }
        .bug_box { margin: 5px; float: left; border: 5px double #eeeeff; }
        .bug_playground { height: 300px; width: 300px; background: #aaaacc; }
        .bug_problem { height: 150px; width: 150px; background: #ff0000; }
    </style>
</head>
<body>

    <div class="bug_box">
        <div style="position: relative;" class="bug_playground">
            <div id="bug02" style="position: absolute; top: 150px; left: 150px; height: 150px; width: 150px;" class="bug_problem">BUG 02</div>
        </div>
        <a href="#" onclick="$('#bug02').stop(true, true).toggle('blind', 'slow');">Show / Hide</a>
        <p>Bug Ticket #7612</p>
    </div>
    
</body>
</html>