[TheSanches]

Здравствуйте, пишу программу для видео галереи.
Суть программы...
Есть миниатюры с постерами, постеры подтягиваются с ютуба, и один большой блок с видео, при клике на миниатюру, берется ссылка и передается большому блоку с видео.

Проблема в том что работает только одна ссылка с миниатюр, остальные выдают (ВИДЕО НЕДОСТУПНО), в чем может быть причина?

Код ниже, для большей ясности.

<div class="video-gallery">
      <div class="video-gallery__zoom">
        <iframe class='video-gallery__video' src="https://www.youtube.com/embed/LgOPBbBUpUo"  frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>


      </div>
      <div class="video-gallery__container">
        <div class="video-gallery__item">
          <span class="yotube-link">https://youtu.be/LgOPBbBUpUo</span>
        </div>
        <div class="video-gallery__item">
          <span class="yotube-link">https://youtu.be/1Zr-AjDdfrM</span>
        </div>
        <div class="video-gallery__item">
          <span class="yotube-link">https://youtu.be/rJgg00ic1G8</span>
        </div>
        <div class="video-gallery__item">
          <span class="yotube-link">https://youtu.be/cSQmhBjjb1I</span>
        </div>
      </div>


    </div>

.video-gallery
  display: flex

.video-gallery__zoom
  background-color: #000
  width: 50%
  margin: 10px

.video-gallery__container
  width: 50%
  

.video-gallery__item
  margin: 10px
  display: inline-block
  width: 46%
  height: 170px
  background-size: cover
  background-repeat: no-repeat

.video-gallery__video, .video-gallery__video-item
  width: 100%
  height: 100%


.yotube-link
  display: none

"use strict";
$(function() {
    $(".video-gallery__item").each(function() {
      // получаем ссылку
      var linkYoutube = $(this).find('.yotube-link').text();
      // достаем id видео
      var youtubeId = linkYoutube.slice(-11);
      console.log(youtubeId);
        // YouTube миниатюра получаем по id
        $(this).css('background-image', 'url(http://i.ytimg.com/vi/' + youtubeId + '/hqdefault.jpg)');

        // Добавляем иконку Play поверх миниатюры, чтобы было похоже на видеоплейер
        $(this).append($('<div/>', {'class': 'play'}));

        $(this).click(function(){
          var iframeSrc = $('.video-gallery__video').attr('src', 'https://www.youtube.com/embed/' + youtubeId + '?autoplay=1&autohide=1');
          console.log(iframeSrc)
        });
    });
 });