I currently have text showing "free space" with a hover saying "click here to reserve bike". When user clicks on the canvas the colour changes to red but how do I make it so the text changes from "click here to reserve bike" to "bike reserved".

This is the code <https://jsfiddle.net/nayshal/j2y7jm4t/>

```
<div id="canvas-wrap">
  <canvas id="canvas" width=150 height=100> </canvas>
    <p class="text">Click here to reserve bike</p>
    <p class="text1">Free Space</p>
<div id="overlay"></div>
</div>

var c = document.getElementById("canvas");
var ctx = c.getContext("2d");
ctx.rect(0, 0, 180, 100);
ctx.stroke();
ctx.fillStyle = "green";
ctx.fill();

document.addEventListener('click',mouseClick,false);
function mouseClick(e)
{  
ctx.fillStyle = "#FF0000";
ctx.fill();

}

```