GetContext (2d) from dynamically added canvas with jquery

Question

A little newbie here and probably from the bottom, but I iterate over some imported xml and add a container with a div, and then add it using a canvas, and then try to draw this canvas. All I get: getContext () is not a function "Any recommendations received with thanks

var newCanvas = $('<canvas/>', {'class':'cnvsClass'}, {'id': 'theCanvas'}) .width(215) .height(217); $("#innerWrapper") .append($('<div/>', {'class': 'wrapper'}) .append($(newCanvas))); // Have tried $('<canvas/>', $('.cnvsClass'), $("#theCanvas") // I've added [0] after the selector but all I get is // TypeError: $(...).getContext is not a function var ctx = $("#theCanvas").getContext("2d"); var image = new Image(); image.src = "AtlasSheet.png"; $(image).load(function() { ctx.drawImage(image, 830,1165, 215, 217, 0, 0, 215, 217); }); 

Answer 1

To do this, you need your own DOM object.

Try it;

 var ctx = $("#theCanvas").get(0).getContext("2d");