JSFiddle - React, Tailwind, and code Playground

by Maykhel David

HTML

<div class="container">
    <div id="content">
        <ul id="tabs" class="nav nav-tabs" data-tabs="tabs">
            <li class="active"><a href="#tab-1" data-toggle="tab">Web Master</a></li>
            <li><a href="#tab-2" data-toggle="tab">PHP Framework</a></li>
            <li><a href="#tab-3" data-toggle="tab">Web Design</a></li>
        </ul>
        <div id="my-tab-content" class="tab-content">
            <div class="tab-pane active" id="tab-1">
                <h1>Web Master</h1>
                <p>Lorem Ipsum is simply dummy</p>
            </div>
            <div class="tab-pane" id="tab-2">
                <h1>PHP Framework</h1>
                <p>Lorem Ipsum is simply dummy</p>
            </div>
            <div class="tab-pane" id="tab-3">
                <h1>Web Design</h1>
                <p>Lorem Ipsum is simply dummy</p>
            </div>
        </div>
    </div>
</div>

JavaScript

jQuery(document).ready(function ($) {
    $('#tabs').tab();
});