I have a little bit of Javascript that almost works correctly. Here's the code:

function toggle(curlink) {

 curlink.style.backgroundColor = curlink.style.backgroundColor == yellow ? transparent : yellow;

 var maindiv = document.getElementById(grid);

 var links = maindiv.getElementsByTagName(a);

 var list = ;

 for (var i = 0; i < links.length; ++i) {

  var link = links[i];

  if (link.style.backgroundColor == yellow) {

   list += (, + parseInt(link.style.left, 10) + - + parseInt(link.style.top, 10));

  }

 }

 document.theForm.theList.value = list.substring(1);

 return false;

};



window.onload = function() {

 var links = document.getElementById(grid).getElementsByTagName(a);

 for (var i = 0; i < links.length; ++i) {

  links[i].onclick = function() { return toggle(this); }

 }

};

The issue is with line #9; it only works when I specify values for the top and left style property of every link in the array. How do I get the top and left style property values (or X and Y coordinates) of each link in the array with Javascript when those values aren't given?

Also, what would the code above look like in jquery? Not that it's needed - I just want to reduce the code a little and dabble in the jquery framework (I'm a Javascript newbie).

Thanks in advance,
Dude-Dastic