Script Jquery plus boucle de contenu (noob)

Bonjour!

Je me heurte à une difficulté au niveau de l'intégration d'une page.

Cette page génère dynamiquement du contenu sous forme de blocs organisés par onglets (c'est à cela que jquery sert dans mon cas):

Voici mon code html :

<div class="bloc1">
<div id="tabs">
  <ul class='tabs'>
    <li><a href="#tabs-1">First</a></li>
    <li><a href="#tabs-2">Second</a></li>
    <li><a href="#tabs-3">Third</a></li>
  </ul>
  <div id="tabs-1">Lorem ipsum</div>
  <div id="tabs-2">dolor sit</div>
  <div id="tabs-3">amet, consectetur</div>
</div>
<div>

<div class="bloc2">
<div id="tabs">
  <ul class='tabs'>
    <li><a href="#tabs-1">First</a></li>
    <li><a href="#tabs-2">Second</a></li>
    <li><a href="#tabs-3">Third</a></li>
  </ul>
  <div id="tabs-1">Lorem ipsum</div>
  <div id="tabs-2">dolor sit</div>
  <div id="tabs-3">amet, consectetur</div>
</div>
</div>

Voici mon script jquery:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('ul.tabs').each(function(){
              // For each set of tabs, we want to keep track of
              // which tab is active and it's associated content
              var $active, $content, $links = $(this).find('a');

              // If the location.hash matches one of the links, use that as the active tab.
              // If no match is found, use the first link as the initial active tab.
              $active = $($links.filter('[href="'+location.hash+'"]')[0] || $links[0]);
              $active.addClass('active');

              $content = $($active[0].hash);

              // Hide the remaining content
              $links.not($active).each(function () {
                $(this.hash).hide();
              });

              // Bind the click event handler
              $(this).on('click', 'a', function(e){
                // Make the old tab inactive.
                $active.removeClass('active');
                $content.hide();

                // Update the variables with the new link and content
                $active = $(this);
                $content = $(this.hash);

                // Make the tab active.
                $active.addClass('active');
                $content.show();

                // Prevent the anchor's default click action
                e.preventDefault();
              });
            });
        });
    </script>

Cela ne fonctionne pas mon script ne différencie pas les deux blocs.

La solution que j'imagine serait de mettre un compteur permettant de nommer différemment chaque tab

(<div id="tabs1">,<div id="tabs2">...)

Mais le problème est que je ne sais pas comment faire une boucle en jquery de façon à créer des paramètres pour chaque bloc ($('ul.tabs1').each..., $('ul.tabs2').each...) et je suis convaincu qu'il y a une solution plus propre.

Je vous serais très reconnaissant d'une quelconque aide.

Cypress