title: getElementById does not work after ajax call
body: <p>I'm developing a web application using javascript / ajax . </p>
  
  <p>The problem is that in my application (a kind of social network) I need to read information about users (posts in a database). To do this I use a PHP dedicated service with the interactions with database. The service returns HTML formatted for the main page.</p>
  
  <p>Now, I use this service with an AJAX call to bring the HTML and injects it into my page. The problem is that when I try to get an element from the injected HTML with javascript:</p>
  
  <pre><code>document.getElementById('commentsArea_xxx').innerHTML=xmlhttp.responseText;
  </code></pre>
  
  <p><code>getElementById</code> returns <code>null</code>.</p>
  
  <p>I think the problem is that after the AJAX call the browser does not update the document and so 'commentsArea_xxx' doesn't exist in the document!</p>
  
  <p>How do I fix this problem?</p>
  
  <p>This is my code:</p>
  
  <pre><code>function moreComments(id){
          var footerIcon = document.getElementById('footer');
              footerIcon.innerHTML="&lt;div style='text-align:center;'&gt;&lt;img src='images/home_selected.png' onClick='loadHome()'/&gt;&lt;img id='cameraButton' src='images/camera.png'/&gt;&lt;img src='images/list.png' onClick='loadMyVideo()'/&gt;&lt;/div&gt;";
              pageOld=pageCurrent;
              pageCurrent=0;
              document.getElementById("ajaxContent").innerHTML="&lt;div id='wrapper' style='top:95px;'&gt;&lt;div id='scroller'&gt;&lt;ul id='thelist'&gt;&lt;li style='text-align:center;'&gt;&lt;img src='images/loading.gif' style='text-align:center;'&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;&lt;/div&gt;";
              var xmlhttp;
              if (window.XMLHttpRequest){
                  xmlhttp=new XMLHttpRequest();
              }
              else{
                  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
              xmlhttp.onreadystatechange=function(){
                  if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200){
                      document.getElementById("commentsArea_"+id).innerHTML=xmlhttp.responseText;
                      loaded();
                      me();
                      setTimeout(function () {myScroll.refresh();}, 0);
                  }
              }
              xmlhttp.open("GET","home_more.php?id="+id,true);
              xmlhttp.send();
      } 
  </code></pre>