Change div content onclick with AJAX

[djfenom]

I have a page with a list of properties, on each property is a view more link. When this link is pressed I want to be able to expand the box with more content which resides on an external page.

I have got it so that one div is changing, but because there are multiple listings, I need a unique id for each div.

I've currently got:

<script type="text/javascript">

var xmlHttp

function showDetail(intID) {

xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="lettings-detail.asp";
url=url+"?id="+intID;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("detail_box"+intID).innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}


</script>

Then on the page:

<a href="#" class="detail" onclick="showDetail('<%=RS("propID")%>'); return false;">view details</a>

<div id="detail_box<%=RS("propID")%>"></div>

I can't seem to pass the intID value into the stateChanged function to get a unique div id??

Also how would I go about toggling the view details link to remove the div again?

Many thanks

[abduraooft]

How about
xmlHttp.onreadystatechange=function (){
stateChanged(intID);
}

[djfenom]

Ahh, almost, it was that and then when the function was called it was:

function stateChanged(intID)

Any ideas how to do the toggle?

Thanks