Post dynamic content with ajax setInterval
<p>I have a multiple tables as below, i want to print the name every 2 seconds on my first table without interrupting table2, if i use innerHTML it's always printing on top (above table1 &amp; table2, but i need the variable on a specific location like in my case table1, if i use document.write on change() function it's keep looping the function infinitely and not coming out means table1 &amp; table2 not showing up? could you please suggest the better way to resolve this?</p>

<p>I have the following code on my update.php </p>

<pre><code>&lt;html&gt;  
&lt;head&gt;  
&lt;link href="css/sample.css" rel="stylesheet" type="text/css" /&gt; 

&lt;div id="changeText" &gt;&lt;/div&gt;  

&lt;script type="text/javascript"&gt;    
var text = ["Welcome", "David", "Paul", "John"];  
var counter = 0;  
var elem = document.getElementById("changeText");   


function change() {  
elem.innerHTML = text[counter];  
counter++;  
if(counter &gt;= text.length) { counter = 0;   
}


&lt;/script&gt; 

&lt;body&gt;  
&lt;tr&gt;  
&lt;td&gt; 
&lt;table align="left" width=15%&gt;  
&lt;td &lt;B&gt;&lt;font color="green"&gt;Name:&lt;script type="text/javascript"&gt;setInterval(change, 2000);
&lt;/script&gt;  
&lt;/font&gt;&lt;br&gt;  
&lt;/td&gt;  
&lt;/table&gt;  
&lt;table id="sample" width=70% cellpadding="2" cellspacing="1" border="1"&gt;
&lt;th class="sno" colspan="2"&gt;SNO&lt;/th&gt;
&lt;th class="fname" colspan="2"&gt;FIRST NAME&lt;/th&gt;
&lt;th class="lname" colspan="2"&gt;LAST NAME&lt;/th&gt; 
&lt;/table&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>My goal is print the array of text under this tag   </p>

<pre><code>&lt;td &lt;B&gt;&lt;font color="green"&gt;Name:&lt;script type="text/javascript"&gt;setInterval(change, 2000);&lt;/script&gt;&lt;/font&gt;
</code></pre>

<p>it should keep printing every 2 seconds with a name change...</p>
