音の再生を重複したくない

ボタン（画像）を押すと音が鳴り、再度押すと止まるサイトを作成中なのですが、再生とストップは出来たのですが、複数ボタンを設置すると、「ボタン1」を再生中に「ボタン2」を押すと1.mp3の音楽再生したまま、2.mp3が再生されてしまいます。
「ボタン2」のボタンを押したら1.mp3は止まるようにしたいのですが、教えて頂けますでしょうか？

HTML

<span class="soundBtn1 clicked1">再生・停止</span>
<audio id="overSound1" preload="auto">
<source src="1.mp3" type="audio/mp3">
  ※お使いの環境では再生できません。
</audio>
<span class="soundBtn2 clicked2">再生・停止</span>
<audio id="overSound2" preload="auto">
<source src="2.mp3" type="audio/mp3">
  ※お使いの環境では再生できません。
</audio>
<span class="soundBtn3 clicked3">再生・停止</span>
<audio id="overSound3" preload="auto">
<source src="3.mp3" type="audio/mp3">
  ※お使いの環境では再生できません。
</audio>

JavaScript

$(function(){
  $(".soundBtn1").click(function(){
    if($(this).hasClass("clicked1")){
      $(this).removeClass("clicked1");
      document.getElementById("overSound1").currentTime = 0;
      document.getElementById("overSound1").play();
    }else{
      $(this).addClass("clicked1");
      document.getElementById("overSound1").pause();
    }
  });
});

$(function(){
  $(".soundBtn2").click(function(){
    if($(this).hasClass("clicked2")){
      $(this).removeClass("clicked2");
      document.getElementById("overSound2").currentTime = 0;
      document.getElementById("overSound2").play();
    }else{
      $(this).addClass("clicked2");
      document.getElementById("overSound2").pause();
    }
  });
});

$(function(){
  $(".soundBtn3").click(function(){
    if($(this).hasClass("clicked3")){
      $(this).removeClass("clicked3");
      document.getElementById("overSound3").currentTime = 0;
      document.getElementById("overSound3").play();
    }else{
      $(this).addClass("clicked3");
      document.getElementById("overSound3").pause();
    }
  });
});