JSFiddle - React, Tailwind, and code Playground

HTML

<div class="videoWrapper">
      <iframe id="movie_player" width="560" height="315" src="https://www.youtube.com/embed/a6cl6D0dmMw?list=PL1HIp83QRJHRbmJl0sS0CLOuIKCBCB76L" frameborder="0" allowfullscreen></iframe>
    </div>

JavaScript

var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('movie_player', {
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  function onPlayerReady() {
    console.log("hey Im ready");
    //do whatever you want here. Like, player.playVideo();

  }

  function onPlayerStateChange() {
    console.log("my state changed");
  }