Почему не работают табы?

$('.link').on('click', function() { 
  $(this).siblings('.link').removeClass('active'); 
  $(this).addClass('active'); 
 
  const index = $(this).parent().children('.link').index( $(this) ); 
   
  let linksBlock = $(this).closest('.main-links'); 
  if (linksBlock.length === 0) { 
    linksBlock = $(this); 
  } 
 
  linksBlock.siblings('.tab').hide(); 
  linksBlock.siblings('.tab').eq(index).show(); 
});

.tab { 
  display: none; 
} 
 
.tab-content { 
  display: none; 
} 
 
.link { 
  background: #fff; 
  border: 1px solid #ddd; 
  border-radius: 5px; 
  margin: 5px; 
  padding: 3px 8px; 
  cursor: pointer; 
} 
 
.link:focus { 
  outline: none; 
} 
 
.link.active { 
  border: 1px solid #000; 
} 
 
.content { 
  margin: 5px; 
  padding: 10px; 
  border: 1px solid #ddd; 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="mama-tab"> 
  <!-- Первый уровень РОДИТЕЛИ--> 
  <div class='main-links'> 
    <button class="link">iPhone 5</button> 
    <button class="link">iPhone 5S</button> 
    <button class="link">iPhone 5C</button> 
    <button class="link">iPhone 6C</button> 
    <button class="link">iPhone 7C</button> 
  </div> 
  <!-- Первый уровень ДЕТИ-->	 
    <div class="tab"> 
      <button class="link">Попал в воду</button> 
      <button class="link">Не работает тачскрин</button> 
      <button class="link">Не работает дисплей</button> 
 
      <div class="tab content">Попал в воду - 3000 руб </div> 
      <div class="tab content">Не работает тачскрин - 5000 руб</div> 
      <div class="tab content">Не работает дисплей - 10000 руб</div> 
    </div> 
  <!-- Первый уровень ДЕТИ-->		 
    <div class="tab"> 
      <button class="link">Попал в воду</button> 
      <button class="link">Не работает тачскрин</button> 
      <button class="link">Не работает дисплей</button> 
 
      <div class="tab content">Попал в воду - 4000 руб </div> 
      <div class="tab content">Не работает тачскрин - 5000 руб</div> 
      <div class="tab content">Не работает дисплей - 10000 руб</div> 
    </div> 
  <!-- Первый уровень ДЕТИ-->		 
    <div class="tab"> 
      <button class="link">Попал в воду</button> 
      <button class="link">Не работает тачскрин</button> 
      <button class="link">Не работает дисплей</button> 
 
      <div class="tab content">Попал в воду - 5000 руб </div> 
      <div class="tab content">Не работает тачскрин - 5000 руб</div> 
      <div class="tab content">Не работает дисплей - 10000 руб</div> 
    </div> 
 
  <!-- Первый уровень ДЕТИ-->		 
    <div class="tab"> 
      <button class="link">Попал в воду</button> 
      <button class="link">Не работает тачскрин</button> 
      <button class="link">Не работает дисплей</button> 
 
      <div class="tab content">Попал в воду - 6000 руб </div> 
      <div class="tab content">Не работает тачскрин - 5000 руб</div> 
      <div class="tab content">Не работает дисплей - 10000 руб</div> 
    </div> 
 
    <!-- Первый уровень ДЕТИ-->	 
    <div class="tab"> 
      <button class="link">Попал в воду</button> 
      <button class="link">Не работает тачскрин</button> 
      <button class="link">Не работает дисплей</button> 
 
      <div class="tab content">Попал в воду - 7000 руб </div> 
      <div class="tab content">Не работает тачскрин - 5000 руб</div> 
      <div class="tab content">Не работает дисплей - 10000 руб</div> 
    </div> 
</div>