JSFiddle - React, Tailwind, and code Playground

HTML

<div style="position:relative; z-index: 10; height: 500px; left:20px; top: 50px; width: 200px;">
	<div style="background-color: #999999; position: relative; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; opacity: 0.2; height:auto;"></div>
	<h1>Jed Nguyen</h1>
	<ul>
		<li><a onClick="srcChange('http://a.tumblr.com/tumblr_m2pbkgjONS1qacyuuo1.mp3')" href="#" >HOME</a></li>
		<li><a onClick="srcChange('http://3.bp.blogspot.com/-X5mp3IGS01I/Tn2EClUpvtI/AAAAAAAAOAM/5g7wl6wORyw/s1600/Paisajes-de-Mar.jpg')" href="#" >PORTFOLIO</a> </li>
		<li><a onClick="srcChange('http://www.boe.es/boe/dias/2004/12/08/pdfs/A40463-40464.pdf')" href="#" >CONTACT</a> </li>
	</ul>
</div>

<div style="position:relative;left: 250px;top: 50px; z-index: 10; width: 800px; height: 500px;">
	<div style="background-color: #999999; position:relative; z-index:-1; top:0; left:0; right:0; bottom:0; opacity:0.2;"></div>
	<embed id="embed1" src="" width="800" height="500" style="opacity:0.2;">
        </div>

JavaScript

function srcChange(url) { 
    var oldEmbed = document.getElementById('embed1');
    var newEmbed = oldEmbed.cloneNode(true);
    newEmbed.src = url;
    oldEmbed.parentNode.replaceChild(newEmbed, oldEmbed);
    //location.reload();
    //alert(document.getElementById('embed1').src);
}