title: javascript: getElementById problem in IE
body: <p>I am trying to attach a click event to a check box using JavaScript. Shown below is the HTML and JS.</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;&lt;/title&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;input type="hidden" name="caution_c" value="0"&gt;
          &lt;input type="checkbox" id="caution_c" name="caution_c" value="1" tabindex="120"&gt;
          &lt;script type="text/javascript"&gt;
              var cb = document.getElementById('caution_c');
              cb.onclick = function() {
                  alert(1);
              }
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The problem is that in IE, the click event does not fire. I have narrowed down the problem location. The issue is that there is a hidden input just before the check box and both these elements have the same name. I'm not sure why this is causing a problem(after all, I'm using getElementById and the hidden element does not even have an id).</p>
  
  <p>Is there a valid reason for this type of behavior (IE only. Works fine in Firefox...as always :( )? Also, is there a good workaround (I could just do <strong>document.getElementsByName('caution_c')[1]</strong> but I don't want to...)</p>