youtubeApiTest.html

<div id = "popup">ここを押せば再生が始まります</div>
<div id = "player" style = "display: none"></div>

<script src = "https://www.youtube.com/iframe_api"></script>
<script>
	var player;
	var onYouTubeIframeAPIReady = function(){
		player = new YT.Player("player",{videoId: "dFf4AgBNR1E"});
	}

	var popup = document.getElementById("popup");
	popup.style.fontSize = "36pt";
	popup.onclick = function(){
		if (document.getElementById("player").style.display === "none"){
			document.getElementById("player").style.display = "block"; // 表示して
			popup.innerHTML = "ここを押せば再生が止まります"; // popupを書き換えて
			player.playVideo(); // 動画再生
		}else{
			player.stopVideo(); //　動画を止めて
			popup.innerHTML = "ここを押せば再生が始まります"; // popupを書き換えて
			document.getElementById("player").style.display = "none"; // 非表示に
		}
	}
</script>