I'm embedding a youtube vid into a webpage using jQuery. Why? Because I want valid HTML markup.

So here's what I'm doing:
Code:
$(document).ready(function(){
  var youtube = $('#youtube a').attr('href').match(/http:\/\/youtu.be\/(.+)/)[1];
  $('#youtube').append('<iframe width="560" height="315" src="http://www.youtube.com/embed/' + youtube + '" frameborder="0" allowfullscreen></iframe>');
});
The HTML markup is as follows:
Code:
<div id="youtube">
  <a href="http://youtu.be/dr0tCny046Q">New Video - Not Tonight</a>
</div>
And I'm getting the following error message:
Unsafe JavaScript attempt to access frame with URL http://www.heycarrianne.co.uk/ from frame with URL http://www.youtube.com/embed/dr0tCny046Q. Domains, protocols and ports must match.

What gives? Don't really understand why this is unsafe. Not sure what to do about it.

Cheers,
Mike