Preventing the browser from reading the YouTube code until the image was clicked

This one uses:
event.target.getVideoUrl();

function onPlayerStateChange(event) {
  if (event.data == YT.PlayerState.PLAYING) {
    var temp = event.target.getVideoUrl();
    var tempPlayers = $("iframe.yt_players");
    for (var i = 0; i < players.length; i++) {
      if (players[i].getVideoUrl() != temp) players[i].pauseVideo();

    }
  }
}

Instead of
event.target.a.src;

    function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING) {
            var temp = event.target.a.src;
            var tempPlayers = $("iframe.yt_players");
            for (var i = 0; i < players.length; i++) {
                if (players[i].a.src != temp) 
                    players[i].pauseVideo();
            }
        }
    }

I don’t know which it should be.
And is there a difference in which is used?
Maybe one is more appropriate to use than the other for this.

And how would I remove the jquery from it?

And will it work in here?
https://jsfiddle.net/d72Lp43v/153/

I tried putting it in the code but I’m having trouble with it,
and it would need to be converted to .forEach