I have an iFrame on a page set to `display: none;`

```
<div id="the-stage" style="display:none;">
<iframe src="index.html" scrolling="no">
</iframe>
</div><!--end the-stage-->

```

Which has a `<video>` tag within it:

```
<video id="video1" width="345" height="264" controls poster="poster.jpg">
<source src="video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="video.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="video.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>

```

On the page which has the `<iframe>` tag, I was trying to play the video when the hidden div is revealed:

```
jQuery("a.launch").click(function(){
jQuery("#the-stage").fadeIn();
jQuery("#video1").get(0).play();
return false;
});

```

But then I got the following error in the console:

> 
> // The console output. cannot call method play of undefined
> 
> 
> 

Any ideas?
Thank you in advance.