[AJAX]jQuery podstrony na divach tzw. tab., jak zmodyfikować to? Opcje

[casperii]

Witam, mam kod, który działa, lecz chciałbym go zmodyfikować i nie bardzo wiem jak.

[HTML] pobierz, plaintext 
<style>
.tab {
    display:block;
}
.tab.active,
.tab:hover {
}
.content {
    display:none;
    clear:both;
    background:#FFF;
    padding:20px;
}
.content.active {
    display:block;
}
</style>
 
<script>
    $(function () {
 
      $('[data-tab]').on('click', function (e) {
        $(this)
          .addClass('active')
          .siblings('[data-tab]')
          .removeClass('active')
          .siblings('[data-content=' + $(this).data('tab') + ']')
          .addClass('active')
          .siblings('[data-content]')
          .removeClass('active');
        e.preventDefault();
      });
 
    });
</script>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
         <div data-tab="1" class="tab active"><a href="#">Tab 1</a></div>
         <div data-tab="2" class="tab"><a href="#">Tab 2</a></div>
         <div data-tab="3" class="tab"><a href="#">Tab 3</a></div>
         <div data-tab="4" class="tab"> <a href="#">Tab 4</a></div>
         <div data-tab="5" class="tab"><a href="#">Tab 5</a></div>         
 
          <div data-content="1" class="content active">Tab 1 Content</div>
          <div data-content="2" class="content">Tab 2 Content</div>
          <div data-content="3" class="content">Tab 3 Content</div>
          <div data-content="4" class="content">Tab 4 Content</div>
          <div data-content="5" class="content">Tab 5 Content</div>
[HTML] pobierz, plaintext 

Chciałbym, teraz włożyć część pierwszą divów w dwa divy. Czyli takie coś:

[HTML] pobierz, plaintext 
<div><div>
         <div data-tab="1" class="tab active"><a href="#">Tab 1</a></div>
         <div data-tab="2" class="tab"><a href="#">Tab 2</a></div>
         <div data-tab="3" class="tab"><a href="#">Tab 3</a></div>
         <div data-tab="4" class="tab"> <a href="#">Tab 4</a></div>
         <div data-tab="5" class="tab"><a href="#">Tab 5</a></div>         
</div></div>         
          <div data-content="1" class="content active">Tab 1 Content</div>
          <div data-content="2" class="content">Tab 2 Content</div>
          <div data-content="3" class="content">Tab 3 Content</div>
          <div data-content="4" class="content">Tab 4 Content</div>
          <div data-content="5" class="content">Tab 5 Content</div>
[HTML] pobierz, plaintext 

Proszę teraz o pomoc w JS tak by mi działało. Dodawanie / usuwanie klasy.

[casperii]

Dziękuje kolego :-) Zastanawiam się czy dobry sposób obrałem, ponieważ w tych divach będą części formularzy np. div z formularzem danych podstawowych (imię, nazwisko), div z formularzem danych szczegółowych (wykształcenie, wiek). Jak myślisz odbije się to później jakoś na tym JS ?