Audio Player mute button (HTML5 and Javascript)

Question

I am trying to create a mute button to my website's custom audio player. Apparently, this simple thing gives me a real headache.

As you see below, I have tried to ad an IF statement to the button. If the volume is on and I press the button, mute the volume. else, if the volume si muted, unmute it.

<audio id="audio" >
<source src="material/audio/sound.mp3"
        type='audio/mpeg;
        codecs="mp3"'/>
</audio>

<button ID="mute"
    onclick="muteAudio()">

<img src="material/images/mute.png"
    ID="mute_img"/>

<script type="text/javascript">

function muteAudio() {
var audio = document.getElementById('audioPlayer');

if (audio.mute = false) {
    document.getElementById('audioPlayer').muted = true;
}
else {
    audio.mute = true 
    document.getElementById('audioPlayer').muted = false;

    }
}
</script>

Answer 1

You need to use == (comparison) rather than = (assignment):

if (audio.mute == false) 
{
    document.getElementById('audioPlayer').muted = true;
}
else 
{
    audio.mute = true 
    document.getElementById('audioPlayer').muted = false;
}

or probably better would be to use the ! (not) operator:

if (!audio.mute)