Estoy usando JavaScript para manejar el botón de reproducción y pausa cuando el usuario hace clic en el botón de pausa de reproducción, pero no funciona en mi caso, arroja el siguiente error en mi consola cuando hace clic en el botón de reproducción Error de tipo no detectado: no se puede leer

 properties of null (reading 'addEventListener') at myMusic.js:46:12

Aquí está mi función de pausa de reproducción de mango

 let audioElement = new Audio('song/Si Tu Te Vas.mp3'); let masterPlay = document.getElementById('masterPlay'); /**Handle play pause click*/ masterPlay.addEventListener('click', () => { if (audioElement.pause() || audioElement.currentTime <= 0) { audioElement.play(); masterPlay.classList.remove('fa-play-circle'); masterPlay.classList.add('fa-pause-circle'); gif.style.opacity = 1; } else { audioElement.pause(); masterPlay.classList.remove('fa-pause-circle'); masterPlay.classList.add('fa-play-circle'); gif.style.opacity = 0; } })

mimusica.html

 <script type="text/javascript" th:src="@{/js/myMusic.js}"></script> <div class="icons"> <!--Font awsome icon --> <i class="fas fa-3x fa-backward" id="previous"></i> <i class="far fa-3x fa-play-circle" id="masterPlay"></i> <i class="fas fa-3x fa-forward" id="next"></i> </div>