JSFiddle - React, Tailwind, and code Playground

by kralco626

HTML

<title>myTitle</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<link rel="stylesheet" media="screen" href="http://users.tpg.com.au/j_birch/plugins/superfish/css/superfish.css" type="text/css" /> 
<link rel="stylesheet" media="screen" href="http://users.tpg.com.au/j_birch/plugins/superfish/css/superfish-vertical.css" type="text/css" /> 
<link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css">
<script src="http://jqueryui.com/ui/jquery.ui.core.js"></script>

<script type="text/javascript" src="http://users.tpg.com.au/j_birch/plugins/assets/js/hoverIntent.js"></script> 
<script type="text/javascript"  src="http://users.tpg.com.au/j_birch/plugins/superfish/js/superfish.js"></script> 
<script type="text/javascript"
src="http://users.tpg.com.au/j_birch/plugins/supersubs/js/supersubs.js"></script>




<script>
    $(document).ready(function(){ 
    addListItem("test123","myItem",null);
        $("ul.sf-menu").superfish();    }); 
 function addListItem(item,parent1,parent2){
    var li = "<li id=\""+item+"\"><a>" + item + "</a></li>";
    if(parent2 == null){
        $("#" + parent1).append(item);
    } else {
        $("#" + parent2).children("#" + parent1).append(item);
    }
    alert(li);
}

</script>
<ul id="top" class="sf-menu">
    <li>
        <a>item098</a>
        <ul id="myItem">
            <li><a>test1</a></li>
            <li><a>test1</a></li>
                
        </ul>
    
    </li>
    <li><a>test1</a></li>
    <li><a>test1</a></li>
</ul>
<br/>
<br/>
<div style="width:600px;height:400px;border:solid 5px black">


<div style="width:500px"><h3 align="center">This is my header</h3></div>

    <ul id="left" class="sf-menu sf-vertical">
        <li>
            <a>item</a>
            <ul>
                <li><a>test1</a></li>
                <li><a>test1</a></li>
            </ul>
        </li>
        <li><a>test1</a></li>
        <li><a>test1</a></li>
   ...