Search code examples
jqueryhtmlaudiotogglemute

Toggling the 'muted' attribute of HTML5 audio

I am trying to create a mute/unmute button, I'm quite new to jquery so it would be helpful if anyone could give me any pointers:

$("#dinner").click(function() {
       var bool = $("#player").muted;
       $("#player").attr("muted",!bool);
});
Solution

  • fixed it, the 'muted' attribute is actually a property:

    $("#dinner").click(function() {
        var bool = $("#player").prop("muted");
        $("#player").prop("muted",!bool);
});

    This can also be done slightly more succinctly by using ES6 arrow functions and also by providing a function to prop() which accepts the current state of the property as an argument. In this case the code would look something like this:

    $('#dinner').on('click', () => $('#player').prop('muted', (_, muted) => !muted));