Question

EDIT: The Problem was in my code, I was not querying the array with the right index.
For anyone looking for an answer for this problem, Karthik Ar answered it right. Thanks for all the comments!

I´m struggling to create an array of unique canvas elements inside a for loop.
It seems as all elements were a copy of the first element created. Im saying this because I need to store this canvas in an array and then access their contexts anytime later.

    var _ctxs = new Array();
    function createCells()
            {
                _w = window.innerWidth;
                _h = window.innerHeight;
                var side = 300;
                //set amount of steps
                var stepsW = Math.ceil(_w/side) + 1;
                var stepsH = Math.ceil(_h/(side/2)) + 1;

                console.log("create cells");
                for (var i = 0; i < stepsH; i++) 
                {
                    var p = (i%2 == 0)?0:side/2;
                    for (var j = 0; j < stepsW; j++) 
                    {
                        var _tempCanvas = $('<canvas/>', {id: "i_" + i + "_" + j, width : side, height : side});
                        _tempCanvas.css({
                            'position' : 'absolute',
                            'top' : (i*(side/2)+1) - side/2,
                            'left' : (j*side + p) + 1 - side/2
                        });

                        //var _tempCtx = _tempCanvas[0].getContext('2d');
                        _ctxs.push(_tempCanvas[0]);

                        $('body').prepend(_tempCanvas);
                        k++;
                    };
                };
            }

Any Thoughs? Thanks in advance!

Answer 1

Looks working by your code check the array.

$(document).ready(jqueryready);
function jqueryready(){
for (var i = 0; i < 5; i++) 
            {
for (var j = 0; j < 5; j++) 
                {
                    var _tempCanvas = $('<canvas/>', {id: i+""+j, width : 10, height : 10});
                    console.log(_tempCanvas[0].id);
                    $('body').prepend(_tempCanvas);
                };
                }
}

This creates unique id for canvas.