JSFiddle - React, Tailwind, and code Playground

HTML

<div id="player"></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('player', {
        height: '390',
        width: '640',
        videoId: 'M7lc1UVf-VE',
        events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
        }
    });
}

function onPlayerReady(event) {  
        player.setPlaybackQuality('hd1080'); // Here we set the quality (yay!)  
 }
 
 function onPlayerStateChange(event) {
 				console.log(event);
        alert("polo");
      }