title: Use document.getElementById after loading with Ajax
body: <p>Please help me out here.</p>
  
  <p>I have a file index.php, relevant portion (Jquery is loaded earlier):</p>
  
  <pre><code>&lt;div id="test"&gt;&lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  $('#test').load("table.php");
  &lt;/script&gt;
  </code></pre>
  
  <p>And a file table.php. If no variables are given, an unfiltered table is shown. When table.php loads, it also loads a select field, like:</p>
  
  <pre><code>&lt;select name="testfield" id="testfield" onchange="javascript:setactionfilter();"&gt;
  &lt;option value="1"&gt;Test&lt;/option&gt;
  &lt;option value="2"&gt;Test2&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>After that, a script to reload table.php in that testdiv with filtered results:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  function setactionfilter(){
  $('#test').load("table.php?action=".document.getElementById('testfield').selectedvalue);
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>The problem is that my browser tells me that the getElementById is null, in other words, it can't find my select field in the page.</p>
  
  <p>Any idea what I am doing wrong?</p>