JSFiddle - React, Tailwind, and code Playground

by zlojnaxa

HTML

<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<style type="text/css">
	#Pn{
		background-color:#CCCCCC; 
		width:200px;   
		font: 8pt/6pt sans-serif;
		height:500px;
	}
	.ui-widget-content {
		border: 1px solid #aaaaaa/*{borderColorContent}*/;
		background: #ffffff;
		color: #222222/*{fcContent}*/;
	}
</style>
<script>
$(document).ready(function(){
    $("#Pn").tabs();
});
</script>
</head>
 <body>
  <div id="Pn" >
    <ul >
      <li><a href="#Pn-1">1 tab</a></li>
      <li><a href="#Pn-2">2 tab</a></li>
      <li><a href="#Pn-3">3 tab</a></li>    
    </ul>
    <div id="Pn-1"> 1 content </div>
    <div id="Pn-2"> 2 content </div>
    <div id="Pn-3"> 3 content </div>  
    </div>  
</body>
</html>