[jQuery] Linking rows on a dynamically generated table

[Kyril Revels]

Hi All --

I'm a bit new to Jquery, but I've been using it for the past few days
and have really come to take a shining to it.  However, recently I've
run into an issue when trying to build a table w/ different links
specified on each row.

Here's my code:

for (var i = 0; i < surveys.length; i++) {
                var cells = new Array(4);
                var row = document.createElement ( 'tr' );
                var sid = surveys[i].survey_id;

                for(var j = 0; j < cells.length; j++)
                        cells[j] = document.createElement( 'td' );

                $(cells[0]).append(surveys[i].survey_name);
                $(cells[1]).append(sid);
                $(cells[2]).append(surveys[i].created_date);
                $(cells[3]).append(surveys[i].completed_date);
                $
(row).append(cells[0]).append(cells[1]).append(cells[2]).append(cells[3])
                        .click(function(){
                                window.location.href = '/view?id=' + sid;
                                });

                $('#history-table').append(row)
}

What seems to happen is that each call to the .click() event sets a
handler for all rows instead of the one row element that I'm
specifying, and so each row links to the last URL generated instead of
each row pointing to a different URL.

Am I missing something here?