
$(document).ready(function(){

 // new class is added for separate optional theming.
 $("#tab-container > .block").addClass("tab-block");

 // iterate through each block chaining functions.
 // This adds the block titles as tab headers -- and removes the titles from the blocks
 $("#tab-container > .tab-block").each(
			   function() {
   $(".title",this)
// wrap .title in li.
.wrap('<li class="tab-title"></li>')
// make link fragment from block id. Must be unique! $(this) = .tab-block or .block
.wrap('<a href="#' + this.id + '"></a>');
   // copy all the class names from the title into the new element
   $("li.tab-title", this).addClass($(".title", this).attr('class'));
   // copy inner text of .title into the link.
   $("li.tab-title > a",this).append($(".title",this).text());
   // delete old .title since markup associated with it doesn't make sense here.
   $("li.tab-title .title",this).remove();
 }
);

 // add an unordered list container to the top of tab-container
 // create a container for the tab headers
 $("#tab-container").prepend('<ul class="tab-title-group"></ul>');

 // move all list items to unordered list container.
 // shove all the LIs into this.
 $("#tab-container > .tab-title-group").prepend($("#tab-container .tab-title"));

 // trigger tabs with optional effects. More options available. Look at the documentation.
 $("#tab-container").tabs(); //{fxAutoheight: false, fxSlide: false, fxFade: true, fxSpeed: 180});

});

$(document).ready(function() {
  TabsInit('tab-container');
});

function TabsInit(container_id) {
  var container = document.getElementById(container_id);
  if(container)
  {
    var ul = container.getElementsByTagName('UL');
    var li = ul[0].getElementsByTagName('LI');

    li[0].className += ' first';
    li[li.length-1].className += ' last';
  }
}

