title: Audio element won't display/play inside iframe in Firefox
body: <p>I have this snippet of HTML5, which allows the user to click and play a bit of audio:</p>
  
  <pre><code>&lt;audio controls&gt;
      &lt;source src="cell.ogg"&gt;
      &lt;source src="cell.mp3"&gt;
      &lt;source src="cell.m4a"&gt;
  &lt;/audio&gt;
  </code></pre>
  
  <p>This works fine in FF 8 on OS X Lion.  The audio player controls appear, I can click play, and it plays the ogg version.</p>
  
  <p>But if I put the containing file inside the iframe of another HTML5 document (both from the local file system; no cross-origin issues), then it doesn't work.  The rest of the HTML displays fine, but Firefox acts as if it doesn't support any of the media formats.</p>
  
  <p>Here's the function I use to add the page to the iframe:</p>
  
  <pre><code>function postContentToIframe(content)
  {
      var iframe = $("#displayContents")[0].contentWindow.document;
      iframe.open(); iframe.close(); // must open and close document object to start using it!
      $("body", iframe).append(content).hide().fadeIn("slow");
      return;
  }
  </code></pre>
  
  <p>Here's how FF renders it.</p>
  
  <p><img src="https://i.stack.imgur.com/1Tj6X.png" alt="enter image description here"></p>
  
  <p>Why?  And how do I fix it?  TIA.</p>