title: Change content of div onclick with Ajax
body: <p>I want to change the content the div named john to the output from the php file when an image is clicked. I'm sure it's simple but I can't find an example that fits. Here's my code:</p>
  
  <pre><code>function ajaxFunction(){
                  var ajaxRequest;
                      ajaxRequest = new XMLHttpRequest();
                  ajaxRequest.onreadystatechange = function(){
                      if(ajaxRequest.readyState == 4){
                          document.getElementById("john").innerHTML=xmlhttp.responseText;
                      }
                  }
                  ajaxRequest.open("GET", "test.php", true);
                  ajaxRequest.send(null); 
              }
  </code></pre>
  
  <p>html</p>
  
  <pre><code>&lt;img class='cross' src='images/cross.png' onclick="ajaxFunction();"&gt;
  &lt;div id='john'&gt;john&lt;/div&gt;
  </code></pre>
  
  <p>test.php</p>
  
  <pre><code>&lt;?php echo "hello"; ?&gt;
  </code></pre>