JSFiddle - React, Tailwind, and code Playground

by jahongirsobirov

HTML

<script src="https://signel.onrender.com/signel.js"></script>
<div class="tabs-demo">
  <div class="tabs-buttons">
    <button class="tab-btn-1">Tab 1</button>
    <button class="tab-btn-2">Tab 2</button>
    <button class="tab-btn-3">Tab 3</button>
  </div>

  <div class="tabs-panels">
    <div class="tab-panel-1">Content for Tab 1</div>
    <div class="tab-panel-2">Content for Tab 2</div>
    <div class="tab-panel-3">Content for Tab 3</div>
  </div>
</div>

JavaScript

// Select buttons and panels as arrays
const buttons = [".tab-btn-1", ".tab-btn-2", ".tab-btn-3"];
const panels = [".tab-panel-1", ".tab-panel-2", ".tab-panel-3"];

// Initialize tabs
tabs({ btn: buttons, panel: panels });