Triggering audio on hover and triggering different audio on click of same div?

Question

I have a div with an image in it. On hover of this image I want one audio to play, then on click of the same image I want another audio to play. This is my code so far, it doesn't seem to work? Any Ideas? Thanks

 <div id="one">
<img src="lib/images/check-mark-32.png" alt=""/></div>

<audio id="sound-1a">
<source src="lib/sound/01 partitano.1.mp3"></source>
<source src="lib/sound/01 partitano.1.ogg"></source>
Your browser isn't invited for super fun audio time.
</audio>
<audio id="sound-1">
<source src="lib/sound/01 Solo Piano - 1 - Metamorphosis.mp3"></source>
<source src="lib/sound/01_Solo_Piano_1_Metamorphosis.ogg"></source>
Your browser isn't invited for super fun audio time.
</audio>

<script>
var audio = $("#sound-1a")[0];
$("#one").mouseenter(function() {
audio.play();
});
var audio = $("#sound-1")[0];
$("#one").click(function() {
audio.play();
});

</script>

Answer 1

try this

$("#one").mouseenter(function () {
    $('#sound-1a').get(0).play();
});
$("#one").click(function () {
    $('#sound-1').get(0).play();
});