title: JavaScript Image map not working (Generated HTML works)
body: <p>I used JavaScript to add image maps.  But the links don't work.  However, if I view the generated HTML in IE Developer Tools (View-DOM Page), then copy the that HTML back into the page, the image map does work.  I have this script at the end of the page within the body tag. I don't have access to change the body tags.</p>
  
  <pre><code>var newDiv = document.getElementById('Graph2');
  var br = document.createElement("br");
  
  //If area is from the Legend
  if (area.type == "chartElement") { 
  var ctx = area.ctx;
  
  var myMap  = document.createElement("map");
  myMap.id = ("mapitem"+String(j));
  myMap.className = "chart_map"; 
  myMap.lid="rsvptt0";
  
  var myArea = document.createElement("area");
  myArea.className = "dl chart_area"; 
  myArea.lid="legendLabel";
  myArea.shape="RECT";
  myArea.coords="0, 0, 20, 20";
  myArea.title=img.children[j].title;
  myArea.ctx=img.children[j].ctx;
  myArea.href="#";
  myMap.appendChild(myArea);
  
  newDiv.appendChild(myMap);
  
  var myImage  = document.createElement("img");
  myImage.name = "imageitem"+String(j);
  
  myImage.style.color ="#000000";
  myImage.style.backgroundColor ="#E3D9B3";
  myImage.style.border ="1pt solid #000000";
  myImage.style.paddingLeft ="0px";
  myImage.style.paddingTop ="0px";
  myImage.style.paddingRight ="0px";
  myImage.style.paddingBottom ="0px";
  myImage.style.backgroundColor ="transparent";
  
  myImage.lid="Combination Chart11";
  myImage.src="../samples/images/green.jpg";
  myImage.usemap="#mapitem"+String(j);
  myImage.border="0" ;
  newDiv.appendChild(myImage);
  newDiv.appendChild(br);
  </code></pre>
  
  <p>Generated HTML works fine:</p>
  
  <pre><code>&lt;MAP id="mapitem21" class="chart_map" lid="rsvptt0"&gt;&lt;AREA class="dl chart_area" title="Fiscal Year = 2010" href="#" shape="RECT" coords="0,0,20,20" ctx="10::1::3" lid="legendLabel" /&gt;
  &lt;/MAP&gt;
  
  
  &lt;IMG style="BORDER-BOTTOM: #000000 1pt solid; BORDER-LEFT: #000000 1pt solid; PADDING-BOTTOM: 0px; BACKGROUND-COLOR: transparent; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; COLOR: #000000; BORDER-TOP: #000000 1pt solid; BORDER-RIGHT: #000000 1pt solid; PADDING-TOP: 0px" border="0" src="http://{ipremoved}/cognos8/samples/images/green.jpg" width="14" height="14" lid="Combination Chart11" usemap="#mapitem21" /&gt;
  &lt;BR /&gt;
  </code></pre>