title: Calling jquery function of child page displayed in iframe from parent page
body: <p>I've got a page where clicking a div calls a function:</p>
  
  <pre><code>$("#fontOpenSans").on("click", function(event) {
      event.stopPropagation();
      $("#dlVersion *").css("font-family", $(this).css("font-family"));
      localStorage.font_family = $(this).css("font-family");
  });
  </code></pre>
  
  <p>I am showing this page in iframe now i want to call same function from out side of this page (From the page in which iframe is placed).</p>
  
  <p>If I declare it like this:</p>
  
  <pre><code>function callfontOpenSans() {
      event.stopPropagation();
      $("#dlVersion *").css("font-family", $(this).css("font-family"));
      localStorage.font_family = $(this).css("font-family");
  }
  </code></pre>
  
  <p>Then I can call it like this:</p>
  
  <pre><code>$('#iframeID').contentWindow.callfontOpenSans();
  </code></pre>
  
  <p>How would I call a function written in the first way from outside the page (i.e. the parent page)? Thanks in advance.</p>