JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://via.placeholder.com/50x50" alt="lorem1" data-url="https://www.youtube.com/embed/_DxbT8411a8">
<img src="http://via.placeholder.com/50x50" alt="lorem2" data-url="https://www.youtube.com/embed/7FIejNVBciQ">
<img src="http://via.placeholder.com/50x50" alt="lorem3" data-url="https://www.youtube.com/embed/_DxbT8411a8">
<img src="http://via.placeholder.com/50x50" alt="lorem4" data-url="https://www.youtube.com/embed/7FIejNVBciQ">
<div id="content">
  <iframe width="560" height="315" src="" frameborder="0" allowfullscreen></iframe>
</div>

JavaScript

let imgs = document.querySelectorAll('img'),
		cont = document.querySelector('#content iframe');

imgs.forEach(function(img){
	img.addEventListener('click',function(){
  	cont.src = this.dataset.url;
  } ,false);
});