jQuery.fn.verticaltab = function (options) {
  var lib = hsp;
  return this.each(function () {
    // we do just the html manipulation here, events will be stripped of when content is copied to the cv
    var $container = $(this);
    $container.find('li').click(function () {
      lib.info('static click handler');
    });
    // grab the first div
    var $content = $container.children('div:eq(0)');
    $content.addClass('verticaltab-content');
    // we add another hidden div to save the default content
    $container.append('<div class="verticaltab-default" style="display:none"></div>');
    var $def = $container.children('.verticaltab-default');
    // save the default content
    $def.html($content.html());
  });
};

// this clickhandler has to be bound every time content
// is moved somewhere with the jQuery html() function
// Extra generated markup keeps intace, but the event handlers are removed!
jQuery.fn.verticaltab.clickhandler =function () {
  var $container = $(this).parent().parent('.verticaltab');
  var $default = $container.children('div.verticaltab-default');
  var $content = $container.children('div.verticaltab-content');

  var trans = function (source) {
    $content.fadeOut(10,function () {
      $content.html(source.html());
      $content.fadeIn(10);
    });
  };

  if ($(this).hasClass('verticaltab-selected')) {
    $(this).removeClass('verticaltab-selected');
    // the selected tab is unselected, so show the default
    trans($default);
  } else {
    $(this).siblings('li').removeClass('verticaltab-selected');
    $(this).addClass('verticaltab-selected');
    // this has been selected, so load my content
    var $mydiv = $(this).find('div');
    trans($mydiv);
  }
  return false;
}

// does not work in ios, thus deprecated:
//jQuery('.verticaltab > ul > li').live('click',jQuery.fn.verticaltab.clickhandler);

// add and remove the hover class
jQuery('.verticaltab > ul > li').live('mouseenter',function () {
  $(this).addClass('hover');
  return false;
});

jQuery('.verticaltab > ul > li').live('mouseleave',function () {
  $(this).removeClass('hover');
  return false;
});