iframe ReferenceError: $ is not defined
<p>I have a requirement to load the templates in the iframe, so i have written this code</p>

<pre><code>&lt;div class="col m8 l8 s12 margin-top-30" id="hue-demo-bg-div"&gt;
     &lt;iframe id="myiframe" src="/themes/{{$themeid}}.html" width="560" height="550" style="border-width: 0; position:fixed;"&gt;&lt;/iframe&gt;
&lt;/div&gt;
</code></pre>

<p>I am loading my templates html file dynamically, in that html file i have written some script but it gives me error as</p>

<blockquote>
  <p>ReferenceError: $ is not defined</p>
</blockquote>

<p>But i loaded the jquery.min.js in the file in which iframe div is written. But it's not loading the js from that page. As i load the js in the theme page it will not give error. But i have to load the js in each theme. Any solution to doesn't load the js in the theme file.</p>