Problem z javascriptem (prawdopodobnie cos z onclickiem)

Question

Witam. Zbudowalem sobie kilka fcji ktore po kliknieciu otwieraja modal video z iframem w srodku.

Z niewiadomych dla mnie powodow dziala to jedynie dla niektorych przyciskow. Nie ma to za duzo sensu, poniewaz jest to budowane w ten sam sposob w js.

Kod

function generatePageCode(linkId, title) {
    var longCode = '' +
        '<div class="videoThumbnailContainer col-md-3 col-sm-6 col-xs-12 category-shape">' +
        '<div class="inside-category col-md-4 col-sm-6 col-xs-12">' +
        '<div class="col-md-12 text-center">' +
        '<img data-toggle="modal" data-target="#videoModal" class="videoThumbnail" src="https://img.youtube.com/vi/' + linkId + '/0.jpg" alt="placeholder">' +
        '<br>' +
        '<div>' + title + '</div>' + //Video title
        '</div>' +
        '</div>' +
        '</div>';
    return longCode;
}
var isFirstPass = true;
function getTitle(videoId) {

    return $.ajax({
        url: "https://www.googleapis.com/youtube/v3/videos?id=" + videoId + "&key=" + "AIzaSyCgYF3yku5L2xM4jtdxJMxbFnZoa-DQapA" + "&fields=items(snippet(title))&part=snippet",
        dataType: "json",
        success: function (data, status, jqxr) {
            var title = data.items[0].snippet.title;
            var titleLoaded = new CustomEvent('titleLoaded', {
                detail: {
                    loaded: true
                }
            });
            $('body')[0].dispatchEvent(titleLoaded);
            var pageCode = generatePageCode(videoId, title);
            $('#addedContent').append(pageCode);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert(textStatus, +' | ' + errorThrown);
        }
    });
}

function showVideos(channel) {
    if (!isFirstPass) {
        $('#addedContent').remove();
    }
    $('#dropdownVideoPicker').append('<div id="addedContent" class="container"></div>');

    var arr = $.map(channel, function (data) {
        getTitle(data);
    });

    $('#hideVideosButton').show();
    $.when.apply($, arr).then(function () {
        // $('#addedContent').hide();
        // $('#addedContent').slideDown(500);
        isFirstPass = false;
        $("html, body").animate({
            scrollTop: ($('.category-shape:nth-of-type(6)').offset().top)
        }, 500);
        grabYtId();
    });
}

function grabYtId() {
    $('.videoThumbnail').on('click', function () {
        var $ytId = $(this).attr('src').slice(27, -6);
        console.log($ytId);
        showModalWindow($ytId);
    });
}

function showModalWindow(Id) {
    var $theModal = $("#videoModal"),
        iframe = $("#iframe")[0],
        videoSRC = 'https://www.youtube.com/embed/' + Id,
        videoSRCauto = videoSRC + "?autoplay=1&rel=0&controls=1&showinfo=0";
    $(iframe).attr('src', videoSRCauto);
    $('button.close').click(function () {
        $(iframe).attr('src', 'ziemniak');
    });
    $theModal.on("hidden.bs.modal", function () {
        $(iframe).attr('src', 'ziemniak');
    });
}

 

Podaje link do strony gdyby ktos chcial kuknac jak to wyglada i w czym jest problem. Po prostu poklikajcie i zobaczycie co sie wyprawia.

https://vast-atoll-28054.herokuapp.com/video.php

Ktos wie dlaczego tak sie dzieje?

Comments

Które przyciski nie działają?

---

Problem w tym ze nie zawsze te same. Teraz te 4 ostatnie w commercial