multiple sounds on different mouseovers

Question

I am finding trouble with multiple mousovers with different sounds.

trouble: when i do a mousover on Rockbutton it will play the song of Popaudio. Is there a better way or a simple solution for this? Many thanks!

    // Muziekje Rock --------------------------------------------------Muziekje rock
    document.getElementById("RockButton").onmouseout = function() {mouseOut()};
    function mouseOver() { 
        document.getElementById('RockDanceAudio').play();
    }
    function mouseOut() { 
      document.getElementById('RockDanceAudio').pause();
    }




       document.getElementById("PopButton").onmouseout = function() {mouseOut()};
    function mouseOver() { 
        document.getElementById('PopAudio').play();
    }
    function mouseOut() { 
      document.getElementById('PopAudio').pause();
    }



<!-- Pagina3 Tatjana                                  PaginaDrieTatjana-->
    <div id="PaginaDrieTatjana" style="display:none;">
      <h1>Kies soort dans</h1>

      <div id="Rock">
        <h3>Rock Dance</h3>
        <img src="Tatjana/Een.jpg" style="width: 100%;">
        <div id="RockButton">
            <p>Kiezen</p>
            <audio id="RockDanceAudio" src="rock_audio.mp3"></audio>
        </div>
      </div >

      <div id="Pop">
        <h3>Pop Dance</h3>
        <img src="Tatjana/Twee.jpg" style="width: 100%;">
        <div id="PopButton">
            <p>Kiezen</p>
            <audio id="PopAudio" src="pop_audio.mp3"></audio>
        </div>

Answer 1

You're overwriting mouseOut and mouseOver functions, try this:

var rockButton = document.getElementById("RockButton");
rockButton.onmouseout = function() {
    document.getElementById('RockDanceAudio').pause();
};
rockButton.onmouseover = function() { 
    document.getElementById('RockDanceAudio').play();
};


var popButton = document.getElementById("PopButton");
popButton.onmouseout = function() {
    document.getElementById('PopAudio').pause();
};
popButton.onmouseover = function() { 
    document.getElementById('PopAudio').play();
};