jQuery脚本在iframe中不起作用

Question

我想在iframe标签内执行脚本，但它对我不起作用，尝试各种可能的方式，但仍面临同样的问题。

link到jsFiddle

iframe中的内容是使用脚本注入的，样式工作完美但我的jQuery脚本无效:(我不知道为什么......

任何人都可以解决我的问题吗？

感谢。

代码：

	var htmlcontent = '<button id="btn">click me</button>';
	var previewFrame2 = document.getElementById('preview');
	var preview2 =  previewFrame2.contentDocument ||  previewFrame2.contentWindow.document;
	preview2.open();
	preview2.write(htmlcontent);
	preview2.close();

    var $head = $("#preview").contents().find("head");                
    $head.html("<style> button { padding:10px; border:0px; background:green } </style>");
    
    var $body = $("#preview").contents().find("body");
    $body.append("<script src='http://code.jquery.com/jquery-1.12.0.min.js'><\/script><script type='text/javascript' > jQuery(document).ready(function() { jQuery('#btn').click(function() { alert('iam clicked') }); }); <\/script>");

    <iframe id="preview" frameborder="0"></iframe>
<script src='http://code.jquery.com/jquery-1.12.0.min.js'></script>