JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<a class="item-icon video fancybox-youtube" href="http://www.youtube.com/watch?v=GNZBSZD16cY">Link 1</a>     <a class="item-icon video fancybox-youtube" href="http://www.youtube.com/watch?v=GNZBSZD16cY">Link 2</a>

JavaScript

jQuery(document).ready(function($) {

	$(".fancybox-youtube").click(function() {
	 $.fancybox({
	  'hideOnContentClick': false,
	  'autoScale': false,
	  'transitionIn': 'none',
	  'transitionOut': 'none',
	  'width': 680, // or your size
	  'height': 495,
	  'href': this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
	  'type': 'swf',
	  'swf': {
		'wmode': 'transparent',
		'allowfullscreen': 'true'
	  }
	 }); // fancybox
	 return false;
	}); 



});