JS's play() in jQuery ? [duplicate]

Question

Is there equivalent of JS's play() or pause() methods in jQuery ? I'm looking for jquery solutions but preferably no other plug-ins.

$('#play').click(function() { 
    function play() {  
      //  the same in jquery ?  
        document.getElementById('demo').play();
        document.getElementById('demo').volume = 1;       
    }
    function play_pause() { 
       //  the same in jquery ?
        document.getElementById('demo').pause();
        document.getElementById('demo').currentTime = 0;        
    }
    if ( $(this).val() === "play" ) {
       $(this).val("pause"); 
       play();
    } else {
       $(this).val("play");
      pause();
    } 
});

I need the simplest solution, not big fancy plugins please.

Answer 1

You can get the raw HTML element from jQuery like this;

$("#demo")[0].play();

You may also need to check if the demo element actually exists:

if($("#demo").length) $("#demo")[0].play();

So in your example, you would have:

$('#play').click(function() { 
    if ( $(this).val() === "play" ) {
       $(this).val("pause");
       $("#demo")[0].play();
       $("#demo")[0].volume = 1;
    } else {
       $(this).val("play")[0].pause();
       $("#demo")[0].pause();
       $("#demo")[0].currentTime = 0; 
    } 
});