JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>

    </head>
    <body>
        <div id="example"  class="tabs"  style="width: 698px;">
            <ul style="list-style: none;">
                <li><a href="#tabs-1">Overview</a></li>
                <li><a href="#tabs-2" >Specifications</a></li>
                <li><a href="#tabs-3" >Exterior</a></li>
                <li><a href="#tabs-4" >Interior</a></li>
                <li><a href="#tabs-5" >Dimensions</a></li>
                <li><a href="#tabs-6" >Feature</a></li>
                <li><a href="#tabs-7" >Instrument Panel</a></li>
                <li><a href="#tabs-8">Color</a></li>
            </ul>
            <div id="tabs-1" style="width: 698px;">
                This is Tab one
            </div>
            <div id="tabs-2">
            </div>
            <div id="tabs-3">
            </div>
            <div id="tabs-4">
            </div>
            <div id="tabs-5">
            </div>
            <div id="tabs-6">
            </div>
            <div id="tabs-7">
            </div>
            <div id="tabs-8">
            </div>
        </div>
    </body>
</html>

JavaScript

$(function ($) {
                $('#example').tabs();
                //$("#example li").removeClass("ui-corner-top").addClass("ui-corner-left");
               // $('#example')
            });