jQuery simple tabs

tabs.js

$('ul.tab-controls li').bind('click', function() {
  $(this).addClass('active').siblings().removeClass('active')
    .parents('#funbox').find('ul.tab').hide().eq($(this).index()).fadeIn(500);
  return false;
});

// HTML:
// <div id="funbox">
//   <ul class="tab-controls">
//     <li class="active"><a href="#">Featured</a></li>
//     <li><a href="#">Popular</a></li>
//     <li><a href="#">Archives</a></li>
//   </ul>
//   <ul class="tab"><li>Hello from the first tab</li></ul>
//   <ul class="tab"><li>Hello from the second tab</li></ul>
// </div>