AJAX getElementsByClassName

Question

I'm new to AJAX and have some problems understanding it. I have this code:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var titles = xmlhttp.responseText.getElementsByClassName('title');
        document.getElementById("mydiv").innerHTML=titles;
    }
}
xmlhttp.open("GET", "index.html", true);
xmlhttp.send();

This will produce the error: "Uncaught TypeError: undefined is not a function".

I don't really understand why I can't get the classes, id's or anything from it. How can I do this?

Answer 1

responseText will be a string, not a DOM object.

Use responseXML instead.

Note that getElementsByClassName will return a NodeList, not a string of HTML, so you'll also need to process it before assigning it to innerHTML.