Почему я не могу нарисовать две линии разных цветов на холсте HTML5?

Я пытаюсь использовать холст HTML5, чтобы нарисовать красную линию слева от зеленой линии. Вот мой javascript:

var canvas = document.createElement('canvas');
canvas.height = 150;
canvas.width = 150;
var canvasContext = canvas.getContext('2d');
canvasContext.beginPath();

// Draw the red line.
canvasContext.strokeStyle = '#f00';
canvasContext.moveTo(10, 0);
canvasContext.lineTo(10, 100);
canvasContext.stroke();

// Draw the green line.
canvasContext.moveTo(50, 0);
canvasContext.strokeStyle = '#0f0';
canvasContext.lineTo(50, 100);
canvasContext.stroke();

document.body.appendChild(canvas);​

Однако в Google Chrome я получаю темно-зеленую линию слева от светло-зеленой линии. Почему? Я назвал инсульт дважды, верно? Следовательно, почему мой первый удар должен влиять на мой второй?

Здесь — JSFiddle, который иллюстрирует то, что я имею в виду.