I try to start video but I get an Error

TypeError: 'undefined' is not a function (evaluating '$("video")[0].play()')

But everything works perfectly in another browsers

$('a').bind('click', function() {
  $('video')[0].play();
});

<video controls>
  <source id="webm" src="/video.webm" type="video/webm" />
  <source id="mp4" src="/video.mp4" type='video/mp4'/>
</video>

I try to start video but I get an Error

TypeError: 'undefined' is not a function (evaluating '$("video")[0].play()')

But everything works perfectly in another browsers

$('a').bind('click', function() {
  $('video')[0].play();
});

<video controls>
  <source id="webm" src="/video.webm" type="video/webm" />
  <source id="mp4" src="/video.mp4" type='video/mp4'/>
</video>

• javascript
• jquery
• html
• video

Share Follow edited Feb 24, 2014 at 12:00 Alexey asked Feb 24, 2014 at 11:55 AlexeyAlexey 33766 silver badges1717 bronze badges 16

• 1 wrap your code inside document.ready handler – Deepak Ingole Commented Feb 24, 2014 at 11:57
• Ok where is a.js-video-popup-button-new – Sudharsan S Commented Feb 24, 2014 at 11:58
• 1 @Pilot ofcourse it's wrapped – Alexey Commented Feb 24, 2014 at 12:00
• 1 @Mr_Green it's not a plugin it's html5 method w3schools./tags/ref_av_dom.asp – Alexey Commented Feb 24, 2014 at 12:15
• 1 @Anton2012 what is console.log($('video').length)????? – Deepak Ingole Commented Feb 24, 2014 at 12:28

 |  Show 11 more ments

3 Answers 3

Sorted by: Reset to default 3

I don't understand why this hasn't been correctly answered by now, but here goes:

The latest Safari version for Windows is very old (v5 was originally released in 2010) and most likely doesn't support html5 video, and thus the DOM element looked up by $('video')[0] has no play() function.

If you use safari on windows, you must install QuickTime player. Without it video will not play.

play is not a jQuery function but a function of the DOM element. You therefore need to call it upon the DOM element.

You can try this:

 $('video').get(0).play();  

if you wanted to do this to fit in with an existing jQuery selection -- would be $('#videoId').get(0).play().

---

Updates:

I think you have to use .preventDefault() method too. so as per your code you can try with adding the event to preventDefault().

$('a').bind('click', function(e) {
   e.preventDefault();
   $('video')[0].play();
});