jQuery使用动态内容中断移动iFrame

Question

如何使用动态内容集移动iFrame？

在模式之后，iFrame内容消失了。

为了说明，我创建了一个jsfiddle：

<div id='source'>
  <p> source </p>
  <div id='wrapper'>
    <iframe id='f'>

    </iframe>
  </div>
</div>
<div id='dest'>
  <p> dest </p>
</div>

<button id='btnGo'> Go</button>
<script>
(function($) {
  $('#f').contents().find('html').html("<strong>Hello</strong>");
  $('#btnGo').click(function() {
    $('#wrapper').appendTo($('#dest'));
  });
})(jQuery);
</script>

老问题，实际上与twitter无关：

我正在尝试将推特小部件从一个容器移动到另一个容器。

然而，当小部件移动时，它变得空白。 使用任何dom explorer，我可以看到它的内部iframe的主体是空的。

如何解决这个问题？

A reproductible fiddle shows the behavior。

我正在尝试使用jQuery.move移动小部件：

  $("#btnRepro").click(function() {
    $("#wrapper").appendTo($("#right"));
  });

使用此代码段生成小部件（在Twitter网站上生成：

<div id='wrapper'>
<a class="twitter-timeline" href="https://twitter.com/hashtag/#dragnpoint" data-widget-id="709489444726968320">Chargement des tweets</a>
<script>
  ! function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if (!d.getElementById(id)) {js = d.createElement(s);js.id = id;js.src = p + "://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js, fjs);}}(document, "script", "twitter-wjs");

</script>
</div>