Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Rob Kramers
Rob Kramers
12,732 Points
Posted by Rob Kramers
Rob Kramers
12,732 Points

Div is not showing. While console is showing the request being made. Why?

Hello everyone, when i open the preview page and i refresh it it does not show the div. When i open the javascript console it shows me this:

(index):16 XHR finished loading: GET "http://port-80-271hkggzyp.treehouse-app.com/sidebar.html".

Why is the div not showing on my preview page? All help is appreciated.

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href='//fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> <title>AJAX with JavaScript</title> <script> var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function () { if (xhr.readystate === 4) { document.getElementById('ajax').innerHTML = xhr.responseText; } }; xhr.open('GET', 'sidebar.html'); xhr.send(); </script> </head> <body> <div class="grid-container centered"> <div class="grid-100"> <div class="contained"> <div class="grid-100"> <div class="heading"> <h1>Bring on the AJAX</h1> </div> <div id="ajax">

      </div>
    </div>
  </div>
</div>

</div> </body> </html>

1 Answer

John Johnson
John Johnson
11,790 Points
John Johnson
John Johnson
11,790 Points

Upper case the 's' in "if (xhr.readystate === 4)" in your onreadystatechange callback.