[jQuery] hovering over a table based map

[Brian Ronk]

I have a table based map (each square of the table is a different map
area) and would like to use a hover as a sort of legend.  So, when I
hover over an area, I get a popup, or something, that says "this is a
rock and a chicken".  My map is based on an array of 10x10 numbers
(for the base) and then (probably, haven't fully decided yet) names to
indicate special areas on the map.  So, 2 10x10 maps, one filled with
numbers, the other has mostly null, with some names that will link to
an image, specified by an id.  (Sorry if that's a little confusing).

Because of the way it is set up, and the fact that the map could
change, I wanted the hover to be dynamic.  The map is stored as a
variable, so all I would (theoretically) have to do is get the
description from legend[map.[y][x]].desc (where legend is an array 0 -
whatever number) that has a description of each map tile).

I wasn't sure how I would link a specific td in the page, so I thought
a for loop with eq would work.  So, I have a 10x10 map, 100 td
elements in it.  Go from 0 - 99, and on each one, create a hover event
that (right now) shows the number in the div with id=test.  I tried it
with slice as well (the commented out part is my test with eq) to see
if that made a difference.  What happens is that everything displays
100.

Obviously, I'm going about this the wrong way.  Any ideas?

for(var i = 0; i < 100; ++i) {
        //$('#map td:eq(' + i + ')').hover(
        $('#map td').slice(i, i + 1).hover(
                function() {
                        var y = i / 10;
                        var x = i % 10;
                        $('#test').html(y + ', ' + x);
                },

                function() {
                        $('#test').html("");
                });
}