I've created a Javascript object via prototyping. I'm trying to render a table dynamically. While the rendering part is simple and works fine, I also need to handle certain client side events for the dynamically rendered table. That, also is easy. Where I'm having issues is with the this reference inside of the function that handles the event. Instead of this references the object, it's referencing the element that raised the event.

See code. The problematic area is in ticketTable.prototype.handleCellClick = function():

function ticketTable(ticks)

{

    // tickets is an array

    this.tickets = ticks;

} 



ticketTable.prototype.render = function(element)

    {

        var tbl = document.createElement(table);

        for ( var i = 0; i < this.tickets.length; i++ )

        {

            // create row and cells

            var row = document.createElement(tr);

            var cell1 = document.createElement(td);

            var cell2 = document.createElement(td);



            // add text to the cells

            cell1.appendChild(document.createTextNode(i));

            cell2.appendChild(document.createTextNode(this.tickets[i]));



            // handle clicks to the first cell.

            // FYI, this only works in FF, need a little more code for IE

            cell1.addEventListener(click, this.handleCellClick, false);



            // add cells to row

            row.appendChild(cell1);

            row.appendChild(cell2);





            // add row to table

            tbl.appendChild(row);            

        }



        // Add table to the page

        element.appendChild(tbl);

    }



    ticketTable.prototype.handleCellClick = function()

    {

        // PROBLEM!!!  in the context of this function, 

        // when used to handle an event, 

        // this is the element that triggered the event.



        // this works fine

        alert(this.innerHTML);



        // this does not.  I can't seem to figure out the syntax to access the array in the object.

        alert(this.tickets.length);

    }