I would like to call multiple videos from the YouTube channel for a section, the calls would be one by one, by click, to the various titles corresponding to the video, or it could also be a link. grateful.
<ul>
<li><a class="video-thumbnail" href="https://www.youtube.com/watch?v=_y7rKxqPoyg" title="Um título legal aqui">Vídeo 1</li>
<li><a class="video-thumbnail" href="https://www.youtube.com/watch?v=dCWkeFBCPnA" title="Outro título legal aqui">Vídeo 2</li>
<li><a class="video-thumbnail" href="https://www.youtube.com/watch?v=VcF7SySRkHs" title="Mais um título legal aqui">Vídeo 3</a></li>
</ul>
<div class="video-placeholder">
<iframe width="820" height="380" frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/_y7rKxqPoyg"></iframe></div>functiongetVideoId(url){varregExp=/^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=)([^#\&\?]*).*/,match=url.match(regExp);if(match&&match[2].length===11){returnmatch[2];}else{thrownewError("Invalid video URL");
}
}
var videos = document.querySelectorAll('.video-thumbnail'),
placeholder = document.querySelector('.video-placeholder'),
i, len;
for ( i = 0, len = videos.length; i < len; i++ ) {
videos[i].addEventListener('click', function (e) {
e.preventDefault();
var videoUrl = getVideoId(this.getAttribute('href'));
var title = this.getAttribute('title');
placeholder.innerHTML = '<iframe width="820" height="380" frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/'+videoUrl+'"></iframe>';
document.title = title;
}, false);
}