How to create a Tabs without bootstrap

How to create a tabs without bootstrap, Here we are using simple java script code

HTML

<div class="tabsingle br_left tab-active" target="1" style="cursor:pointer;"> Tab1 </div>
<div class="tabsingle br_left" target="2" style="cursor:pointer;"> Tab2 </div>
<div class="tabsingle br_left" target="3" style="cursor:pointer;"> Tab3 </div>
<div id="div1" class="targetdiv">
Tab1 Content Here
</div>			 
<div id="div2" class="targetdiv" style="display:none;">
Tab2 Content Here
</div>			 
<div id="div3" class="targetdiv" style="display:none;">
Tab3 Content Here
</div>

CSS

.tab-active{color:white;background:darkseagreen;}
.tabsingle{display:inline-block;padding:10px 30px;outline:1px solid darkseagreen;}
.targetdiv{padding:30px;border:1px solid darkseagreen;}

 

JavaScript

jQuery(function(){
jQuery('.tabsingle').click(function(){
jQuery('.targetdiv').hide();
jQuery('#div'+$(this).attr('target')).show();
jQuery('.tabsingle').removeClass('tab-active');
$(this).addClass("tab-active");
});
});