Edit in JSFiddle

document.getElementById("video").setAttribute("src", "https://www.youtube.com/embed/99BK0ctSkl4?rel=0&showinfo=0");
/* xu ly su kien khi click vao 1 trong cac video trong slide ben duoi */
var btn = document.getElementsByClassName("thumbnail-vd");
for(i = 0; i < btn.length; i++){
	btn[i].addEventListener("click", function(){
		var id = this.getAttribute("id-video");
		document.getElementById("video").setAttribute("src", "https://www.youtube.com/embed/"+id+"?rel=0&amp;showinfo=0&amp;autoplay=1");
	});
}
<div class="slide-video">
	<div class="play-video">
		<iframe id="video" width="560" height="315" src="" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen>				</iframe>
	</div>
	<div class="slide">
		<div class="all-video">
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/fxnz1ouehqw/maxresdefault.jpg" id-video="fxnz1ouehqw"/>
			</div>
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/oAS8vzr3SxI/maxresdefault.jpg" id-video="oAS8vzr3SxI" />
			</div>
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/hibIxiZQgJ8/maxresdefault.jpg" id-video="hibIxiZQgJ8" />
			</div>
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/vG_4FIsH5IY/maxresdefault.jpg" id-video="vG_4FIsH5IY"/>
			</div>
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/gyCqfJAnkJc/maxresdefault.jpg" id-video="gyCqfJAnkJc"/>
			</div>
			<div class="item">
				<img class="thumbnail-vd" src="https://img.youtube.com/vi/Obs5rzZu540/maxresdefault.jpg" id-video="Obs5rzZu540"/>
			</div>
		</div>
		
	</div>
</div>
.slide-video {
	height: 425px;
	width: 580px;
	margin: 10px auto;
	background: #000;
	padding: 10px;
}
.play-video {
	box-sizing: border-box;
	width: 580px;
	height: 335px;
}
.slide {
	position: relative;
	width: 100%;
	height: 90px;
	overflow-x: auto;
}
.all-video {
	position: absolute;
	width: 745px;
}
.item {
	width: 120px;
	max-height: 67.5px;
	overflow: hidden;
	float: left;
}
.item+.item {
	margin-left: 5px;
}
.thumbnail-vd {
	width: 120px;
	height: auto;
	cursor: pointer;
}
.thumbnail-vd:hover {
	background: #000;
	opacity: 0.2;
}
.thumbnail::before{
	position: relative;
	content: "xem";
	color: #fff;
}