title: onclick handler not firing for checkbox created with document.createElement
body: <p>I am going insane trying to figure out why this is not working. I am creating a checkbox dynamically with JS to enable/disable a text field (also created dynamically).</p>
  
  <p>Code is pretty simple:</p>
  
  <pre><code>var text = $(document.createElement("input"));
  text.type = "text";
  container.appendChild(text);
  
  ...
  
  var check = $(document.createElement("input"));
  check.type = "checkbox";
  check.onclick = function(event) {
      if (this.checked) text.enable();
      else text.disable();
  };
  container.appendChild(check);
  </code></pre>
  
  <p>I've tried putting the event handler after <code>container.appendChild(check);</code>, but that yields the same result.</p>
  
  <p>There are no JS errors, and results are the same in Chrome, FF3.6, and IE7.</p>
  
  <p>Can anyone explain why this isn't working? Any fixes would be appreciated.</p>
  
  <p>Strangely (because theoretically it should be the same as above), adding the following (after <code>container.appendChild(check);</code>) works (checkbox is first on page):</p>
  
  <pre><code>$$("input[type=checkbox]")[0].onclick = function(event) {
      if (this.checked) text.enable();
      else text.disable();
  };
  </code></pre>
  
  <p>I don't really like this, as it seems "dirty", and the checkbox may not be the first on the page later on...</p>
  
  <p>BTW, $ and $$ are from Prototype.</p>
  
  <p>Thanks in advance for any help.</p>