Javascript 单击时无法停止音频

我在单击时停止音频播放器时遇到问题。播放器成功启动，但当我再次单击时，我无法停止它。你能帮我吗？下面是一个代码：

$(".portfolio-listen").click(function(e) {
  e.preventDefault();
  var audioUrl = $(this).attr("href");
  var audioElement = document.createElement("audio");
  audioElement.setAttribute('src', audioUrl);
  $(this).toggleClass("playing");

  if ($(this).hasClass("playing")) {
    audioElement.play();
  } else {
    audioElement.pause();
  }


});

---

如果您希望根据单击的按钮加载新的音频源，但将音频元素设置为全局并检查其是否已定义，然后继续切换音频播放/暂停，则此示例可能会变得更复杂

//出于演示目的，请使用var audioUrl=$（this.href（'href'））
var audioUrl=https://allthingsaudio.wikispaces.com/file/view/Shuffle%20for%20K.M.mp3/139190697/Shuffle%20for%20K.M.mp3';
//使audioElement全球化
可变音频元件；
$（“.portfolio listen”）。单击（函数（e）{
e、 预防默认值（）；
if（！audioElement）{
audioElement=document.createElement（“音频”）；
setAttribute（'src'，audioUrl）；
}
$（此）.toggleClass（“播放”）；
if（$（this.hasClass（“播放”））{
audioElement.play（）；
}否则{
audioElement.pause（）；
}
});
按钮{
背景：#e91e63；
}
按钮。播放{
背景#8bc34a；
}

播放
您每次单击都会创建一个新的音频播放器，我想您在
切换类（）方面有问题。
谢谢：）工作正常！