我正在尝试创建一个用户可以点击的按钮，它将强制页面上所有嵌入的youtube视频同时开始播放，静音和循环。
这是我试图实现按钮上的页面-www.missingnewyork.com/last-seen
要嵌入每个视频我使用以下代码，现在包括？enablejsapi=1 after each url -

<div id="horizontalcontainer">
        <div id="scrolling-wrapper-video">
            <div class="videocard1">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/1i3x82LoQ1M?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/UrJmZ57EHwg?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/kgcB41C9i94?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/qB5ityfsboU?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/RM0nrCooQic?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>               
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/wqobN25apx4?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/4niCIE9xca4?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/MGWwy_zt6KU?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/JheP24KKaYo?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/8LuzXamIyjE?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/_jv9TQlrru8?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/0TBYVXG1css?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/KqQqxC7aGhw?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/VUzoFhqYbo8?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/ypQjjIoO1Mc?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>                  
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/lzY70qA2Tr4?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/x-UprcCZIX0?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>               
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/DH-TFgizhxw?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/bme8Aa_Z1X0?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>  
            <div class="videocard">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/kw3SAx4Hsd8?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
            <div class="videocardlast">
                <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://www.youtube.com/embed/86DRzKe69i8?enablejsapi=1" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
            </div>              
        </div>
    </div>

我试过使用下面的功能，这是在这篇文章的答案提供-

function playAllVideos() {
    var videos = document.querySelectorAll('iframe[src^="https://www.youtube.com/embed/"]');
    videos.forEach(function(video) {
        video.contentWindow.postMessage('{"event":"command","func":"playVideo","args":""}', '*');
        video.contentWindow.postMessage('{"event":"command","func":"mute","args":""}', '*');
        video.contentWindow.postMessage('{"event":"command","func":"setLoop","args":"1"}', '*');
    });
}

这是我正在使用的按钮

<button id="play-all" style="position: fixed; top: 20px; left: 20px;">PLAY ALL</button>

这是我必须让按钮和功能有关系的东西

var playAllButton = document.getElementById('play-all');

playAllButton.addEventListener('click', playAllVideos);

不幸的是，当我点击按钮时，什么也没有发生。我想最后这段代码可能有什么问题。有人知道我哪里做错了吗
为了澄清，我只希望视频自动播放/循环/静音，如果，用户点击播放所有按钮。如果用户不点击播放所有按钮，我需要的网页，以完全按照它目前的行为。
谢谢你的帮助！