Youtube IFrame API を使って複数動画を再生させたい

動的に取得したYoutubeIDをもとに複数のYoutube動画を再生させたいのですが、
onYouTubeIframeAPIReady()内部の配列に挿入する部分でnullになってしまいうまく動作しません。

javascriptが不慣れで原因がわからず困っております。

参考ソース
https://www.neko-it.com/blog/4534.html

HTML
1<div id="youtube01" data-yt="lnbFQ9zVwG8" class="video-area"></div>
2<div id="youtube02" data-yt="lnbsQ9zVwG8" class="video-area"></div>
3<div id="youtube03" data-yt="lnbFQ9zVqG8" class="video-area"></div>
4

javascript
1
2//youyube
3$(function() {
4
5  var ytData = [];
6  var ytPlayer = [];
7
8
9  const arrayIds = document.querySelectorAll("div[id*='youtube']");
10
11  arrayIds.forEach(function(target) {
12    var iframe = target.id;
13    var youtube = document.getElementById(iframe);
14    var youtubeId = youtube.getAttribute('data-yt');
15    var ojbect = { 'area' : iframe, 'id' : youtubeId };
16    ytData.push(ojbect);
17  })
18
19  // YouTube Player APIの読み込み
20  var tag = document.createElement('script');
21  tag.src = "https://www.youtube.com/iframe_api";
22  var firstScriptTag = document.getElementsByTagName('script')[0];
23  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
24
25  // プレイヤーの埋め込み
26  function onYouTubeIframeAPIReady() {
27    for(var i = 0; i < ytData.length; i++){
28      console.log(ytData);
29      ytPlayer[i] = new YT.Player(ytData[i]['area'], {
30        videoId: ytData[i]['id'],
31        playerVars: {
32          rel: 0, // 関連動画の非表示
33          controls: 0, // プレイヤーコントロールの非表示
34          showinfo: 0, // タイトルなどの非表示
35          modestbranding: 1, // YouTubeロゴの非表示
36          iv_load_policy: 3, // アノテーションの非表示
37          wmode: 'transparent'
38        },
39        events: {
40          'onReady': onPlayerReady,
41          'onStateChange': onPlayerStateChange
42        }
43      });
44    }
45  }
46
47  // プレーヤーの準備ができたとき
48  function onPlayerReady(event) {
49      ytPlayer.playVideo();
50      ytPlayer.mute();
51  }
52
53  // 動画再生中と再生後の動作
54  function onPlayerStateChange(e) {
55    var ytStatus = e.target.getPlayerState();
56    if (ytStatus == YT.PlayerState.PLAYING) { //再生中
57    }
58    if (ytStatus == YT.PlayerState.ENDED) { //再生後
59      ytPlayer.playVideo();
60      ytPlayer.mute();
61    }
62  }
63
64});