Highlighting part in canvas arc using Javascript or jQuery

Question

I have drawn an arc on a canvas, this arc has 3 parts. If user clicks on any one of the part then my code will show an alert with the x and y position. Now I want to highlight this clicked region. How do I do that?

This code draws the arc:

var canvas = document.getElementById('zone');

if(!canvas.getContext){
    alert("canvas not supported");
}
else {
    var canvasContent = canvas.getContext('2d');
    var zoneX = canvas.width / 2;
    var zoneY = canvas.height / 2;
    var radius = 100;

    canvasContent.beginPath();
    canvasContent.arc(zoneX,zoneY, radius, 0, 2 * Math.PI, false);
    canvasContent.fillStyle = 'white';
    canvasContent.fill();
    canvasContent.lineWidth = 1;
    canvasContent.strokeStyle = '#333';
    canvasContent.stroke(); 
    drawLine(canvasContent);
    $('#zone').on('click',function(e){
        var clickX = e.clientX;
        var clickY = e.clientY;
        alert(clickX + " : "+clickY);
    });
}

function drawLine(canvasContentDrawLine) {
    canvasContentDrawLine.beginPath();
    canvasContentDrawLine.moveTo(canvas.width / 2, canvas.width / 2);
    canvasContentDrawLine.lineTo(canvas.width / 2.5, canvas.height / 4.7);
    canvasContentDrawLine.moveTo(338, 200 );
    canvasContentDrawLine.lineTo(canvas.width / 2.5, canvas.height / 4.7);
    canvasContentDrawLine.stroke();
}

Fiddle

This code will show an alert with the position:

 $('#zone').on('click',function(e){
     var clickX = e.clientX;
     var clickY = e.clientY;
     alert(clickX + " : "+clickY);
 });