Draw a chessboard on canvas object using new HTML5 api

Chessboard.js

// n = number of cells per row/column


function drawCheckboard(n) {
    grdFrenchFlag = ctx.createLinearGradient(0, 0, 300, 200);
    grdFrenchFlag.addColorStop(0, "blue");
grdFrenchFlag.addColorStop(0.5, "white");
grdFrenchFlag.addColorStop(1, "red");
    ctx.fillStyle = grdFrenchFlag;
    var l = canvas.width;
    var h = canvas.height;
 
    var cellWidth = l / n;
    var cellHeight = h / n;
    for(i = 0; i < n; i++) {
       for(j = i % 2; j < n; j++) {
          ctx.fillRect(cellWidth*i, cellHeight*j, cellWidth, cellHeight);
       }
    }
}