<style>

#divElement{
background-color: orange;
width:70px;
height:100px;
left:143px;
}

</style>



var context = new webkitAudioContext(),
    savedBuffer;

var playAudioFile = function () {
    var source = context.createBufferSource();
    var gainNode = context.createGainNode();
    source.buffer = savedBuffer;


 // START OF PROBLEM AREA: Gain not working but file still plays with no errors.

    source.connect(gainNode);          
    gainNode.connect(context.destination);
    gainNode.gain = 0;

 // END OF PROBLEM AREA

    source.noteOn(0); // Play sound immediately


};

var request = new XMLHttpRequest();

request.open('get', 'audio/A.mp3', true);
request.responseType = 'arraybuffer';

request.onload = function () {
        context.decodeAudioData(request.response,
             function(incomingBuffer) {

                 savedBuffer = incomingBuffer;

                 var divElement = document.getElementById("divElement");
                 divElement.addEventListener("click", playAudioFile , false);
             }
        );
};

request.send();