Simple Tabs in Jquery

script.js

$(document).ready(function() {
  $(".tabLink").each(function(){
    $(this).click(function(){
      tabeId = $(this).attr('id');
      $(".tabLink").removeClass("activeLink");
      $(this).addClass("activeLink");
      $(".tabcontent").addClass("hide");
      $("#"+tabeId+"-1").removeClass("hide");
      return false;
    });
  });  
});

style.css

.tab-box {
  border-bottom: 1px solid #DDD;
  padding-bottom:5px;
}
.tab-box a {
  border:1px solid #DDD;
  color:#666666;
  padding: 5px 15px;
  text-decoration:none;
  background-color: #eee;
}
.tab-box .activeLink {
  background-color: #fff;
  border-bottom: 0;
  padding: 6px 15px;
}
.tabcontent { border: 1px solid #ddd; border-top: 0;}
.hide { display: none;}

tabs.html

<div class="tab-box">
  <a href="javascript:;" class="tabLink activeLink" id="cont-1">Tab 1</a>
  <a href="javascript:;" class="tabLink " id="cont-2">Tab 2</a>
  <a href="javascript:;" class="tabLink " id="cont-3">Tab 3</a>
</div>

<div class="tabcontent paddingAll" id="cont-1-1">
  This is content box one
</div>

<div class="tabcontent paddingAll hide" id="cont-2-1">
  This is content box Two
</div>

<div class="tabcontent paddingAll hide" id="cont-3-1">
  This is content box Three
</div>