JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<div id="tabs" class="tabs" >

            <ul style="color: black;background-color: #b85c5c">

                <li ><a href="#tabs-1" style="color: #b85c5c;background-color:#ffe4e1;" >Home</a></li>

                <li ><a href="#tabs-2" style="color: #b85c5c;background-color:#ffe4e1">Create Book</a></li>
                <li style="float:right"><a onClick="location.href='logout.jsp'" style="color: #b85c5c;background-color:#ffe4e1">Log Out</a></li>

            </ul>

            <div id="tabs-1">

                <p id="intro">

                    Welcome to my Home Page of Library Management Application! This Provides effective solutions needed for a Library.Click any tab to load content from other pages.

                </p>

     

        </div>
<div id=tabs-2>
    <p>This is the Second tab Contents</p>
    </div>
</div>

JavaScript

$(function() {

                $( "#tabs" ).tabs();

                  $("#tabs").css({backgroundColor:'#ffe4e1'});

                $('.time').html(timeClock());

                $("#tabs").css("min-height", "400px");

                $(document).tooltip();

            });