title: Get ID of element that called a function
body: <p>How can I get the ID of an element that called a JS function? </p>
  
  <p><em>body.jpg</em> is an image of a dog as the user points his/her mouse around the screen at different parts of the body an enlarged image is shown. The ID of the area element is identical to the image filename minus the folder and extension.</p>
  
  <pre><code>&lt;div&gt;
      &lt;img src="images/body.jpg" usemap="#anatomy"/&gt;
  &lt;/div&gt;
  
  &lt;map name="anatomy"&gt;
    &lt;area id="nose" shape="rect" coords="280,240,330,275" onmouseover="zoom()"/&gt;
  &lt;/map&gt;
  
  &lt;script type="text/javascript"&gt;
  function zoom()
  {
   document.getElementById("preview").src="images/nose.jpg";
  }
  &lt;/script&gt;
  
  &lt;div&gt;
  &lt;img id="preview"/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I've done my research and have come to Stack Overflow as a last resort. I'm prefer a solution that doesn't involve jQuery.</p>