getting ajax to update corresponding div in mySQL row results

I have this AJAX code:

<script type="text/javascript">
function updateAssigned(assigned , ticketid)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
 {
document.getElementByID('origassigned').innerHTML=xmlhttp.responseText;
 }
} 
xmlhttp.open("GET","ajax_php/assigned.php?assigned=" + assigned + "&ticketid=" + ticketid,true);
xmlhttp.send();
}
</script>

And this HTML

<DIV CLASS="assigned">
  <DIV ID="origassigned"></DIV>
  <SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
       <option>OPTION开发者_运维技巧 1</option>
       <option>OPTION 2</option>
  </SELECT>
</DIV>

<DIV CLASS="assigned">
  <DIV ID="origassigned"></DIV>
  <SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
       <option>OPTION 1</option>
       <option>OPTION 2</option>
  </SELECT>
</DIV>

<DIV CLASS="assigned">
  <DIV ID="origassigned"></DIV>
  <SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
       <option>OPTION 1</option>
       <option>OPTION 2</option>
  </SELECT>
</DIV>

I cannot get AJAX to update the corresponding DIV. It works perfectly updating my database but Only changes the 1st DIV named "assigned" even if I'm updating the second DIV.

Any Ideas what I should change my AJAX code to so that it recognizes which DIV to update? Thanks!

UPDATE: Changed divs to not have same IDs to be more web compliant. Still don't know how to tell AJAX which div to update.

Sidenote: These are generated from a mySQL query result. Each grouping is a different row. but they all come from same template. So the NAMEs CLASSes and IDs have to be the same on each group.

<DIV CLASS="assigned">
<DIV CLASS="origassigned" NAME="origassigned"></DIV>
<SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
   <option>OPTION 1</option>
   <option>OPTION 2</option>
</SELECT>
</DIV>

<DIV CLASS="assigned">
<DIV CLASS="origassigned" NAME="origassigned"></DIV>
<SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
   <option>OPTION 1</option>
   <option>OPTION 2</option>
</SELECT>
</DIV>

<DIV CLASS="assigned">
<DIV CLASS="origassigned" NAME="origassigned"></DIV>
<SELECT onChange="updateAssigned(this.value , {$row['ticket']})">
   <option>OPTION 1</option>
   <option>OPTION 2</option>
</SELECT>
</DIV>

---

your HTML is wrong..

One page should have unique ID and you assign similar id origassigned to each div , because of that it always capture first div with ID=origassigned and update that div again & again.. instead of that use class.. or assign different id to each div..

Thanks

---

You need to have separate names and ids for the three selects. That way your ajax code can handle which element is being updated.