JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tabWidget">
    <div class="tabWidget">
    <div class="tabPanel">
        <h3 class="tab">One</h3>
        <div class="panel">
            <div class="panel-inner">
                <p>Lorem ipsum dolor sit amet.</p>
                <p>Proin posuere, velit non facilisis rutrum.</p>
            </div>
        </div>
    </div>
    <div class="tabPanel selected">
        <h3 class="tab">Two</h3>
        <div class="panel">
            <div class="panel-inner">
                <p>Quisque tempor ligula risus.</p>
            </div>
        </div>
    </div>
    <div class="tabPanel">
        <h3 class="tab">Three</h3>
        <div class="panel">
            <div class="panel-inner">
                <p>Suspendisse a orci turpis.</p>
            </div>
        </div>
    </div>
    </div>
</div>

CSS

.tabWidget {
    overflow: hidden;
}

.tabWidget .tabPanel {
    display: block;
}

.tabWidget .tab {
    clear: both;
    float: left;
    /* change rules below for your desired visual effect */
    cursor: pointer;
    border: 2px solid #000;
    margin-right: 5px;
    padding: 2px 8px;
}

.js .tabWidget .tab {
    clear: none;
}

.tabWidget .panel {
    clear: right;
    display: block;
    float: right;
    margin-left: -100%;
    margin-top: 1.7em;  /* adjust as needed */
    width: 100%;
}

.js .tabWidget .panel {
    display: none;
    clear: none;
}

.tabWidget .panel-inner {
    /* change rules below for your desired visual effect */
    border: 2px solid #000;
    padding: 10px;
}

.tabWidget .selected .tab {
    /* change rules below for your desired visual effect */
    background-color: #000;
    color: #FFF;
}

.js .tabWidget .selected .panel {
    display: block;
}

JavaScript

document.body.className += " js";

$.fn.tabsDoneRight = function(options) {

    return this.each(function(index, el) {

        $(el).find(".tab").each(function(tabIndex, tabEl) {

            $(tabEl).click(function() {

                $(el).find(".selected").removeClass("selected");
                $(this).parents(".tabPanel").addClass("selected");

                return false;
            });

            $(tabEl).attr("tabindex", 0).keypress(function(ev) {

                if (ev.keyCode == 13) $(this).click();
            });
        });

        if (!$(el).find(".tabPanel:has(.selected)").length) {

            $(el).find(".tabPanel").first().click();
        }
    });
};

$(function() {

    $(".tabWidget").tabsDoneRight();
});