jquery - 播放结束时更改音频播放器图标

Question

我正在使用在代码笔上找到的一些代码，这些代码将audio标记设置为样式以使用图标。
原始代码仅适用于一个播放器，因此我已更改为可以在同一页面上与多个播放器一起使用。这可以正常工作，并且确实会根据您单击的图标播放正确的wav文件。
我的问题是，一旦播放完特定的wav文件，图标就不会返回其原始play状态。
我在这里创建了 FIDDLE ，以显示我的意思。
这是我在播放结束时使用的jQuery:

   $('#player' + id).on('ended', function() {
       console.log ('ended')
     $('#speaker' + id).removeClass('speakerplay');
     /*When the audio has finished playing, remove the class speakerplay*/
     audiostatus = 'off';
     /*Set the status back to off*/
   });

我认为问题是由于不知道ID造成的，或者可能是任何一个玩家ID
有人知道我该如何解决吗？
谢谢

Answer 1

看来我已经解决了。

 $('[id^="player"]').on('ended', function() {
     id = this.id.replace('player','')
     $('#speaker' + id).removeClass('speakerplay');
     audiostatus = 'off';
 });

新的 FIDDLE 显示它正常工作。