javascript - Muting a HTML5 audio element using a custom button

Question

What's the best way to mute a HTML5 audio element? I don't want the browser's custom controls, so I've been looking at the javascript instead. Unfortunately it just doesn't seem to work for me :( I'm undoubtedly doing something very wrong.

    <audio id="background_audio" autoplay="autoplay">
      <source src="static/audio/clip.ogg" type="audio/ogg" />
      <source src="static/audio/clip.mp3" type="audio/mpeg" />
    </audio> 

<a href="#" onclick="document._video.muted=true; return false">mute sound</a>

Still getting my head around this. Thanks!

Answer 1

This should work:

document.getElementById('background_audio').muted = true;

Demo: http://jsfiddle.net/mattball/sVwXH/ (no jQuery)