[mister_ex]

Друзья прошу помощи,я новичок сильно не ругайте!!
Есть на странице блоки, в каждом из них свой текст и свой аудио файл. клик по каждому из них воспроизводит свой вложенный аудио файл, проблема следующая!!
Как остановить звук у предыдущего элемента или вообще на странице при клике на другой элемент?
А так этот код JS работает идеально!!!

есть след методы lacal.stop(); local.pause();

Код на JSFiddle для удобства редактирования!!!
https://jsfiddle.net/Rashit1122233/bLk6h5to/2/

HTML код.

<div  class="audio">
       <p>Звук-1</p>
       <audio src="1.mp3" type="audio/mpeg"></audio>
</div>
<div  class="audio">
      <p>Звук-2</p>
      <audio src="2.mp3" type="audio/mpeg"></audio>
</div>
<div  class="audio">
      <p>Звук-3</p>
      <audio src="3.mp3" type="audio/mpeg"></audio>
</div>

Код JS

var blocks = document.querySelectorAll('.audio');
       for(var i = 0; i < blocks.length; i++) {
            var block = blocks[i];
            var audioPlaying = false;
            block.onclick = function() {

               var path = '/android_asset/www/audio/';
               var audioName =this.querySelector('audio1').getAttribute('src');
               var fullPath = path+audioName;
               var local1 = new Media(fullPath);
               local1.play();

                              
            }

        }