如何更改iframe中的字体系列？

Question

我使用这个jQuery插件： http://www.jqueryscript.net/text/Easy-Google-Web-Font-Selector-With-jQuery-Fontselect.html

当我从列表中选择字体时，我希望iframe中的font-family能够更改。

＆＃13;

＆＃13;

$(function(){
  $('#font').fontselect().change(function(){

    // replace + signs with spaces for css
    var font = $(this).val().replace(/\+/g, ' ');

    // split font into family and weight
    font = font.split(':');

    // set family on paragraphs
    $('p').css('font-family', font[0]);
  });
});

＆＃13;

body { padding:50px; background-color:#333;}
p, h1 { color:#fff;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.jqueryscript.net/demo/Easy-Google-Web-Font-Selector-With-jQuery-Fontselect/fontselect.css" />
<script src="http://www.jqueryscript.net/demo/Easy-Google-Web-Font-Selector-With-jQuery-Fontselect/jquery.fontselect.js"></script>

<h1>jQuery Fontselect Plugin Example</h1>

<input id="font" type="text" />

<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.
 Lorem Ipsum has been the industry's </p>

<iframe src="https://en.wikipedia.org" width="500px" height="500px;"/>

＆＃13;

＆＃13;

＆＃13;