title: Can't control Youtube embed even with document.getElementById('xyz').playVideo() - not a function?
body: <p>OK, I'm stuck and I don't know what's wrong even after following Google's docs and reading suggestions here on Stackoverflow.  Why can't I control Youtube embeds in my web page?</p>
  
  <p>If I create an HTML file with the &lt;body&gt; being:</p>
  
  <pre><code>&lt;object id="o1" width="480" height="295"&gt;
    &lt;param name="movie" 
      value="http://www.youtube.com/v/qCTLCNmnlKU&amp;hl=en_US&amp;fs=1&amp;enablejsapi=1&amp;"&gt;
    &lt;/param&gt;
    &lt;param name="allowFullScreen" value="true"&gt;&lt;/param&gt;
    &lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;
    &lt;embed id="e1" 
      src="http://www.youtube.com/v/qCTLCNmnlKU&amp;hl=en_US&amp;fs=1&amp;enablejsapi=1&amp;" 
      type="application/x-shockwave-flash" 
      allowscriptaccess="always" allowfullscreen="true" width="480" height="295"&gt;
    &lt;/embed&gt;
  &lt;/object&gt;
  </code></pre>
  
  <p>Even when I attempt to do:</p>
  
  <pre><code>// I get an object. Yay.
  
  document.getElementById('e1');
  
  // This generates "...playVideo is not a function"
  
  document.getElementById('e1').playVideo();
  </code></pre>
  
  <p>Help!  What am I doing wrong?  Thanks.</p>