myaudio is not a function-CodePudding

I got two divs with audio files:

        <div >
        <audio class ="audio-play" src = "hadeWomA.mp3" type="audio/mpeg"></audio>
      </div>
    <div >
      <audio id ="audio-play" src = "hadeWomB.mp3" type="audio/mpeg"></audio>
    </div>

Im trying to get it to play the one I press on, so i made this:

$(".ru").click(function()
{   
    var myAudio = $(this).children("audio");
    myAudio.play();
});

What am I missing?

When I directily target the audio like this it works

    var myAudio = this.document.getElementById("audio-play");

CodePudding user response：

play() is not a jQuery method, it’s a vanilla JS method and it works with a single element passed, however jQuery selector returns you a set of a elements. You should pick the first one:

myAudio[0].play();