Ajax for image slider does not work.

[Virangya]

hi i made an image slider. it loads all the images from the data base using php and for sliding and timing intervals i used javascrpt and ajax.
through back end of the systems can edit these images and upload new , update and delete.
i want to reflect the changes made in the back end straight away in the front end. so i used ajax request.
but unfortunately it doesn't work :(
this is the first time i'm doing such a thing using ajax. so there maybe errors and in-accurateness. I used ajax to refresh a div. so that div contains everything including php, ajax, javascript. an external file contains function which refreshes the whole thing.

i used firebug and when i check the code i can see the changes i applied through the front end. but the slider doesn't reflect those changes. response is also working as i can see it in firebug console. (also i used an alert() - it worked too).. i don't know how can fix this.. even why it doesn't work.
i will post the content inside that div.

<div id="imageSlider" style="display: none;">
<script type='text/javascript'>

var newImage=new Array();
var imageTime=new Array();



<?php
	
	//$ad_con = new Ad_Controller();
	$resutls1 = Ad_Controller::play_ads($_SESSION['level']);
	if($lan==1)
	$ad_img_dir='images/ad/';
	else if($lan==2)
	$ad_img_dir='images/ad/sinhala/';
	else if($lan==3)
	$ad_img_dir='images/ad/tamil/';
	echo("dir='".$ad_img_dir."';");
	
	
	$im=0;
	$it=0;
	foreach($resutls1 as $rec1){
	
		if($lan==1)
		echo("newImage[".$im."]='".$rec1['image']."';");
		else if($lan==2)
		echo("newImage[".$im."]='".$rec1['image_s']."';");
		else if($lan==3)
		echo("newImage[".$im."]='".$rec1['image_t']."';");
		
		
		
		$im++;
		}
		foreach($resutls1 as $rec1){
		$lev=$_SESSION['level'].'time';
		echo("imageTime[".$it."]='".$rec1[$lev]."';");
		$it++;
		}
	
?>

var bottom = 0;
var padding = 5;
var X = 5;
var Y = 0;

function dropMyPopup() {
 Y++; Y++; 
 if( Y > bottom ){return;}
 document.getElementById("styled_popup").style.top = Y + "px";
 setTimeout("dropMyPopup()", 25);
}

function fireMyPopup(img) {
 var scrolledY;
 if( self.pageYOffset ) {
   scrolledY = self.pageYOffset;
 } else if( document.documentElement && document.documentElement.scrollTop ) {
   scrolledY = document.documentElement.scrollTop;
 } else if( document.body ) {
   scrolledY = document.body.scrollTop;
 }

 var centerY;
 if( self.innerHeight ) {
   centerY = self.innerHeight;
 } else if( document.documentElement && document.documentElement.clientHeight ) {
   centerY = document.documentElement.clientHeight;
 } else if( document.body ) {
   centerY = document.body.clientHeight;
 }

 // Don't forget to subtract popup's height! ( 300 in our case )

 bottom = scrolledY + centerY - padding - ((centerY*30)/100) -((centerY*16)/100);
 Y = scrolledY;

 document.getElementById("styled_popup").style.right = X + "px";
 document.getElementById("styled_popup").style.display = "block";


document.getElementById('styled_popup').style.backgroundImage = "url("+dir+newImage[img]+")";

 dropMyPopup();

  var dtime=parseInt(imageTime[img])+7000;
  
   setTimeout("styledPopupClose()", dtime);
   if(img!=(newImage.length)){
   		htime=img+1;
		var ddtime=dtime+5000;
	   setTimeout(function(){fireMyPopup(htime)},ddtime);
	  
	}
	else if(img==(newImage.length)){
	//Y = 0; 
	 setTimeout(function(){fireMyPopup(0)}, 5000);
	}
}

function styledPopupClose() {
 document.getElementById("styled_popup").style.display = "none";
 Y = bottom; // if it was closed, make sure extra computations are done in dropMyPopup() 
 }
 

</script>
</div>