JSFiddle - React, Tailwind, and code Playground

by Shady Alset

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script>
<p><a href="#Devis" data-toggle="tab">Devis From Outside</a></p>
<br />
<br />

<div>
<ul class="nav nav-tabs">
  <li class="active"><a href="#Itinéraire" data-toggle="tab">Itinéraire</a></li>
  <li><a href="#Hôtels" data-toggle="tab">Hôtels</a></li>
  <li><a href="#Devis" data-toggle="tab">Devis</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane active" id="Itinéraire">Itinéraire Content</div>
  <div class="tab-pane" id="Hôtels">Hôtels Content</div>
  <div class="tab-pane" id="Devis">Devis Content</div>
</div>
</div>
<script>
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    var target = this.href.split('#');
    $('.nav a').filter('a[href="#'+target[1]+'"]').tab('show');
})
</script>