Perfil con pestañas

----------------------- CSS -----------------------
#tabs_content_container {propiedades;}
.tab_content {propiedades;}
#pestanas {list-style: none; display: table; propiedades;}
#pestanas li {display: table-cell; margin:0px;}
#pestanas li a {propiedades;}

----------------------- HTML -----------------------
<div id='tabs_content_container'><div id='TAB1' class='tab_content' style="display: block;"> Aquí irá el contenido de la primera pestaña.
</div>
<div id='TAB2' class='tab_content' style="display: block;"> Aquí irá el contenido de la segunda pestaña.
</div>
</div>
<ul id='pestanas'><li class='active'> <a href='#TAB1'> Nombre del botón 1 </a></li><li><a href='#TAB2'> Nombre del botón 2. </a></li></ul>

----------------------- JAVASCRIPT -----------------------
$(document).ready(function(){
$("#pestanas li").click(function() {
  currentprofile = $(this).parent().parent().parent().parent();
  $("#pestanas li", currentprofile).removeClass('active');
  $(this).addClass("active");
  $(".tab_content", currentprofile).hide();
  var selected_tab = $(this).find("a").attr("href");
  $(selected_tab, currentprofile).fadeIn();
  return false;
});
});