please look at this fiddle http://jsfiddle.net/rabelais/yLdkj/1/

The above fiddle shows three bars that on hover play audios. How do I change this so the music plays and pauses on click instead. Also if one audio is playing and another is clicked how can the already playing song pause?

 $("#one").mouseenter(function () {
 $('#sound-1').get(0).play();
 });
$("#one").mouseleave(function () {
$('#sound-1').get(0).pause();
});
$("#two").mouseenter(function () {
$('#sound-2').get(0).play();
});
$("#two").mouseleave(function () {
$('#sound-2').get(0).pause();
});
$("#three").mouseenter(function () {
$('#sound-3').get(0).play();
});
$("#three").mouseleave(function () {
$('#sound-3').get(0).pause();
});