javascript - How to refer to me html5 canvas drawing more than once? -

i've created drawing using canvas intend use multiple times various navigation links, problem when refer more once show 1. duplicate code each instance plan on using quite lot not ideal. please have @ code below , linked jsfiddle. many thanks.

http://jsfiddle.net/ltu2h/

//first reference <canvas id="canvasid" width="50" height="50"></canvas> //second reference  <canvas id="canvasid" width="50" height="50"></canvas>  <script> var context = document.getelementbyid("canvasid").getcontext("2d");  var width = 125;  // triangle width var height = 45; // triangle height var padding = 5;  // draw path context.beginpath(); context.moveto(padding + width-125, height + padding);        // top corner context.lineto(padding + width-90,height-17 + padding); // point context.lineto(padding, height-35 + padding);         // bottom left context.closepath();  // fill path context.fillstyle = "#9ea7b8"; context.fill(); </script> 

you can have unique id's

---

html:

<canvas id="canvasid" width="50" height="50"></canvas> <canvas id="canvasid2" width="50" height="50"></canvas> 

js:

function drawsomething(canvas) {     var context = canvas.getcontext("2d");      var width = 125;  // triangle width     var height = 45; // triangle height     var padding = 5;      // draw path     context.beginpath();     context.moveto(padding + width-125, height + padding);        // top corner     context.lineto(padding + width-90,height-17 + padding); // point     context.lineto(padding, height-35 + padding);         // bottom left     context.closepath();      // fill path     context.fillstyle = "#9ea7b8";     context.fill();  }  drawsomething(document.getelementbyid("canvasid")); drawsomething(document.getelementbyid("canvasid2"));