Splitting form fields and options into several tabs

<div id="pm3">

<style id="pm3-style" type="text/css">
.pm3-tabs {
 display:table;
}
.pm3-tabs UL {
 margin:0;
 padding:0;
 list-style:none;
}
.pm3-tabs LI.pm3-tab A {
 color:#777;
 border:0;
 display:block;
 padding:.3em .6em;
}
.pm3-tabs LI.pm3-tab {
 background-color:#eee;
 float:left;
 margin-right:.3em;
}
.pm3-tabs LI.Active {
 background-color:#ddd;
}
.pm3-tabs LI.Active A {
 color:#000;
}
.pm3-tabs DIV {
 padding:.5em .7em;
 background-color:#ddd;
 clear:both;
}
</style>

<div id="pm3-module">
  <div class="pm3-tabs">
    <ul>
      <li class="pm3-tab" id="pm3-tab1"><a href="#">One</a></li>
      <li class="pm3-tab" id="pm3-tab2"><a href="#">Two</a></li>
      <li class="pm3-tab" id="pm3-tab3"><a href="#">Three</a></li>
    </ul>
    <div id="pm3-tab1-body">I'm the one's tab content.</div>
    <div id="pm3-tab2-body">I'm the two's tab content<br />and a 2nd line.</div>
    <div id="pm3-tab3-body">Guess who am I -- says the three's tab content.</div>
  </div>
</div>

<script id="pm3-script" type="text/javascript">
pm3 = {
  init: function() {
    $('.pm3-tabs').each(function(){
      var f = pm3.click;
      var group = this;
      $('.pm3-tab', group).each(function(){
        this.group = group;
        $(this).click(f);
        $('#'+this.id+'-body').hide();
      }).filter(':first').trigger('click');
    });
    $('.pm3-tabs ul li:first').addClass('Active');
    $('.pm3-tabs div:first').show();
  },
  click: function(e) {
    e.preventDefault();
    var tab = $('#'+this.id+'-body').get(0);
    $('.pm3-tab', this.group).each(function(){
      $(this).removeClass('Active');
      $('#'+this.id+'-body').hide();
    });
    $(this).addClass('Active');
    $(tab).show();
    this.blur();
  }
};
pm3.init();
</script>

</div>

Some notesπ

• Error after upgrading to latest revision in render/render_page.inc.php (PageElement extends BaseElement doesn't work, killed extends BaseElement and it works!)
• tabs (css) just implemented in theme clean
• some nice tabs are shown in http://www.web.de (where you can switch between "Suche" and "FreeMail")

Next Steps to implement tabsπ

• persons profile edit
• task edit
• company edit