So you want to add content to the bottom of your web page without reloading the whole page or DIV that the majority of your content is located in? You could add a separate DIV to the bottom of your page and use the document.getElementByID(‘myDIV’).innerHTML = xmlHttp response; method to append the new content…

But, what if you want to append multiple times?

• add rows to your favorite database’s front end
• add stories to the front page, as the user scrolls down, like on DZone’s home page
• use it on the top end to dynamically stack new content without user intervention

Why not include new DIV tags within your response code?

Existing DIV at the bottom of your page:

<div id=”newdiv001″>

</div>

xmlHttp Response from the server:

latest news flash here</div>
<div id=”newdiv002″>

After it’s inserted into your existing DIV, it’ll look like this:

<div id=”newdiv001″>
latest news flash here</div>
<div id=”newdiv002″>

</div>

… and now “newdiv002″ is ready to take the next response.
The important thing to remember here, is to keep track of your DIV ids. By using a number at the end of your id’s name, you can keep track of it with a simple counter.