JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<title>super tabbed menu</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
    <script>

</script>
<style>

</style>

</head>
<body>


  <div class="sub">
  <a class="thing" href="#" >this thing will make only one thing appear</a>
    <div class="mydiv">mydiv</div>  
  </div>

  <div class="sub2">
     <a class="thing2" href="#" >this thing will make only one thing appear</a>
     <div class="mydiv2">mydiv2</div>  
  </div>
<br/>
<br/><br/><br/><br/><br/>
<!--  ************************ -->
  <div class="sub">
  <a class="thing" href="#" >this thing will make only one thing appear</a>
    <div class="mydiv">mydiv</div>  
</div>

     <div class="sub2">
     <a class="thing2" href="#" >this thing will make only one thing appear</a>
     <div class="mydiv2">mydiv2</div>  
    </div>


</body>

</html>

CSS

.sub{float:left;padding-left:10px;}

.sub2{float:left;padding-left:10px;}
.mydiv{display:none;position:absolute; float:left;}
.mydiv2{display:none;position:absolute;background-color:grey;float:left;}
.showit{display:block}

JavaScript

$(document).ready(function(){

$('.sub').click(
function () {
  $('.mydiv', this).show();
  $(this).next('.sub2').find("div").hide();  

});


$('.sub2').click(
function () {
  $('.mydiv2', this).show();
  $(this).prev('.sub').find("div").hide();       
});

});