How can i create tab system using jQuery

Creating a simple tab-switching system using jQuery is super easy. No need to use any jQuery plugin for that. Just use simple jQuery and use some CSS like the one below:

//Start jQuery part
<script>
$(document).ready(function(){
  $("button").click(function(){
      	$( ".cmn" ).hide();
     	$( ".cmn" ).eq( $(this).index() ).show();
    });
});
</script>
//jQuery part end

//Start CSS part
<style>
.cmn{
display:none
}
.class1.cmn{
display:block;
}
</style>
//CSS part end

// Start HTML part
<div class="container">

<button>Tab1</button>
<button>Tab2</button>
<button>Tab3</button>
<button>Tab4</button>

<div class="class1 cmn">Tab1 content</div>
<div class="class2 cmn">Tab2 content</div>
<div class="class3 cmn">Tab3 content</div>
<div class="class4 cmn">Tab4 content</div>

</div>
//End HTML part

Here is the output of the above code: