JSFiddle - React, Tailwind, and code Playground

HTML

<iframe id="music" width="310" height="310" src="https://www.youtube.com/embed/v_FucrYWy3k?rel=1&amp;controls=1&amp;showinfo=0&amp;start=1&autoplay=1&enablejsapi=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
<button id='button' type="button" name="button">mute</button>

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('music', {
    events: {
      'onReady': onPlayerReady
    }
  });
}

function onPlayerReady(event) {
  document.getElementById('button').addEventListener('click', function() {
    player.pauseVideo();
  })
}