Javascript-форум - Получить id элемента по клику, но немного хитро

Здравствуйте.
Программку делаю для себя поэтому желательно засунуть всё в жо один файл. Ячейки таблицы содержат SVG-изображения. Кликом по ячейке нужно получать id ячейки, но возвращает XML-примитив.
Можно это как-то разрулить?

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <style>
      table {
        position: absolute;
      }
      td {
        border: black 1px solid;
        width: 70px;
        height: 70px;
      }
      #right {
        border-collapse: collapse;
        right: 2em;
      }
    </style>
    <script>
      var arr_img = ["<svg\nxmlns:dc=\"http://purl.org/dc/elements/1.1/\"\nxmlns:cc=\"http://creativecommons.org/ns#\"\nxmlns:rdf=\"http://www.w3.org/1999/02/22-rdf-syntax-ns#\"\nxmlns:svg=\"http://www.w3.org/2000/svg\"\nxmlns=\"http://www.w3.org/2000/svg\"\nxmlns:sodipodi=\"http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd\"\nxmlns:inkscape=\"http://www.inkscape.org/namespaces/inkscape\"\nwidth=\"70\"\nheight=\"70\"\nviewBox=\"0070.00000170.000001\"\nid=\"svg4187\"\nversion=\"1.1\"\ninkscape:version=\"0.91r13725\"\nsodipodi:docname=\"cog_1.svg\">\n<defs\nid=\"defs4189\"/>\n<sodipodi:namedview\nid=\"base\"\npagecolor=\"#ffffff\"\nbordercolor=\"#666666\"\nborderopacity=\"1.0\"\ninkscape:pageopacity=\"0.0\"\ninkscape:pageshadow=\"2\"\ninkscape:zoom=\"5.6\"\ninkscape:cx=\"4.2210775\"\ninkscape:cy=\"28.778878\"\ninkscape:document-units=\"px\"\ninkscape:current-layer=\"layer1\"\nshowgrid=\"false\"\nunits=\"px\"\ninkscape:window-width=\"1366\"\ninkscape:window-height=\"733\"\ninkscape:window-x=\"0\"\ninkscape:window-y=\"0\"\ninkscape:window-maximized=\"1\"/>\n<metadata\nid=\"metadata4192\">\n<rdf:RDF>\n<cc:Work\nrdf:about=\"\">\n<dc:format>image/svg+xml</dc:format>\n<dc:type\nrdf:resource=\"http://purl.org/dc/dcmitype/StillImage\"/>\n<dc:title></dc:title>\n</cc:Work>\n</rdf:RDF>\n</metadata>\n<g\ninkscape:label=\"Layer1\"\ninkscape:groupmode=\"layer\"\nid=\"layer1\"\ntransform=\"translate(0,-982.36216)\">\n<rect\nstyle=\"opacity:1;fill:#ff0000;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1\"\nid=\"rect4195\"\nwidth=\"70.178574\"\nheight=\"70.178574\"\nx=\"0\"\ny=\"982.36218\"/>\n</g>\n</svg>"];
      document.onclick = function(event) {
        event = event || window.event;
        if (!event.target) {
          event.target = event.srcElement;
        }
        alert(event.target.id);
      }
      function main() {
        for (var i=0; i<arr_img.length; i++) {
          var el = document.getElementById(31+i);
          el.innerHTML = arr_img[i];
        }
      }
    </script>
  </head>

  <body onload="main()">

    <table id="right">
      <tr>
        <td id=31></td><td id=32></td><td id=33></td><td id=34></td><td id=35></td><td id=36></td>
      </tr>
    </table>
  </body>
</html>