JSFiddle - React, Tailwind, and code Playground

HTML

Chien : <br />
<audio controls>
	<source src="http://www.noiseaddicts.com/samples_1w72b820/4936.mp3" type="audio/mpeg">
	Your browser does not support the audio element.
</audio>


<hr />
Éléphant : <br />
<audio controls>
	<source src="http://www.noiseaddicts.com/samples_1w72b820/4941.mp3" type="audio/mpeg">
	Your browser does not support the audio element.
</audio>


<hr />
Cochon : <br />
<audio controls>
	<source src="http://www.noiseaddicts.com/samples_1w72b820/294.mp3" type="audio/mpeg">
	Your browser does not support the audio element.
</audio>

<hr />
Coucou <a href="https://forum.phpfrance.com/html-html5-xhtml-css/superposition-audio-controls-t279219.html">PHPfrance</a> !

JavaScript

document.addEventListener('play', function(e){
    var audios = document.getElementsByTagName('audio');
    for(var i = 0, len = audios.length; i < len;i++){
        if(audios[i] != e.target){
            audios[i].pause();
        }
    }
}, true);