JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://yastatic.net/jquery/2.2.0/jquery.min.js"></script>
<script src="https://yastatic.net/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://owlgraphic.com/owlcarousel/owl-carousel/owl.carousel.min.js"></script>
<link rel="stylesheet" href="http://owlgraphic.com/owlcarousel/owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="http://owlgraphic.com/owlcarousel/owl-carousel/owl.theme.css">
<link rel="stylesheet" href="https://yastatic.net/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<script src="http://tabcollapse.okendoken.com/bootstrap-tabcollapse.js"></script>
<div class="container">
<div class="row">
<div class="col-md-12">





<div class="parrent">
<div id="myTabContent" class="tab-content">
  <div class="tab-pane fade in active" id="tab-1">
    <h2 class="title-tab">Tab</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias nesciunt voluptatibus cum omnis autem sunt dicta eum voluptatum! Blanditiis explicabo ab fugit iure harum excepturi dolorum quam suscipit necessitatibus molestias!</p>
  </div><!--/.tab-pane-->
  <div class="tab-pane fade" id="tab-2">
    <h2 class="title-tab">Tab2</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias nesciunt voluptatibus cum omnis autem sunt dicta eum voluptatum! Blanditiis explicabo ab fugit iure harum excepturi dolorum quam suscipit necessitatibus molestias!</p>
  </div><!--/.tab-pane-->
  <div class="tab-pane fade" id="tab-3">
    <h2 class="title-tab">Tab3</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias nesciunt voluptatibus cum omnis autem sunt dicta eum voluptatum! Blanditiis explicabo ab fugit iure harum excepturi dolorum quam suscipit necessitatibus molestias!</p>
  </div><!--/.tab-pane-->
</div><!--/.tab-content-->
</div>

<div class="parrent">
<div id="myTabContent" class="tab-content">
 ...

JavaScript

$("<ul id='myTab' class='nav nav-tabs'></ul>").prependTo($(".parrent"))
var id=1;
	$(".parrent ul").each(function(){
		i++;
	$(this).attr("id","myTab"+id);
  $('#myTab'+id).tabCollapse();
	});

var l = $(".tab-pane").length-1
for (var i=l; i>=0; i--){
$("<li><a href='#"+$($(".tab-pane")[i]).attr("id")+"' data-toggle='tab'>"+$($(".tab-pane")[i]).find(".title-tab").html()+"</a></li>").prependTo($(".nav-tabs"))
}
$(".nav.nav-tabs li:first").addClass("active")