JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
  <body>
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
    <div class="tubeframe" id="video-frame-155" style="">
   <iframe title="YouTube video player" width="350" height="262" src="http://www.youtube.com/embed/hc5xkf9JqoE?HD=1;rel=0;showinfo=0;autohide=1" frameborder="0" allowfullscreen="" id="video-frame-155-frame"></iframe>
    </div>

  </body>
</html>

JavaScript

var source_tag = document.createElement("script");
  var first_source_tag = document.getElementsByTagName("script")[0];
  first_source_tag.parentNode.insertBefore(source_tag, first_source_tag);
  

  // This function will be called when the API is fully loaded
  function onYouTubeIframeAPIReady() {
  YT_ready(true)
  console.log("api loaded! yikes")
  }
  

function getFrameID(id){
    var elem = document.getElementById(id);
    if (elem) {
        if(/^iframe$/i.test(elem.tagName)) return id; //Frame, OK
        // else: Look for frame
        var elems = elem.getElementsByTagName("iframe");
        if (!elems.length) return null; //No iframe found, FAILURE
        for (var i=0; i<elems.length; i++) {
           if (/^https?:\/\/(?:www\.)?youtube(?:-nocookie)?\.com(\/|$)/i.test(elems[i].src)) break;
        }
        elem = elems[i]; //The only, or the best iFrame
        if (elem.id) return elem.id; //Existing ID, return it
        // else: Create a new ID
        do { //Keep postfixing `-frame` until the ID is unique
            id += "-frame";
        } while (document.getElementById(id));
        elem.id = id;
        return id;
    }
    // If no element, return null.
    return null;
  }
  // Define YT_ready function.
  var YT_ready = (function(){
      var onReady_funcs = [], api_isReady = false;
      return function(func, b_before){
          if (func === true) {
              api_isReady = true;
              while(onReady_funcs.length > 0){
                  // Removes the first func from the array, and execute func
                  onReady_funcs.shift()();
              }
          }
          else if(typeof func == "function") {
              if (api_isReady) func();
              else onReady_funcs[b_before?"unshift":"push"](func);
          }
      }
  })();


  var video = function ( videoid,  frameid) {
    var player;
    var that;
    var seconds;
    var duration;
    var stateChangeCallback;
    var update_play = 0;
      return {
       ...