AJAX Help?

This is what happens . What am I doing wrong? Here is an image of what it is turning out like, and this shouldn't happen.

if (isset ($_GET['add_match'])){

$match_id = $_GET['add_match'];

$sql_match_details = mysql_query("SELECT * FROM Matches WHERE id='$match_id'");
while ($get_match = mysql_fetch_array($sql_match_details)){

$match_name = $get_match['name'];
$match_prestige = $get_match['prestige'];
$match_content_risk = $get_match['content_risk'];
$match_injury_risk = $get_match['injury_risk'];
$match_description = $get_match['description'];

$result = "$match_name";

}

$body = "<div style='width: 300px; float: left'>

<p class='text3' style='font-weight: bold;'>Select Match Type</p>

<form action='promotions.php?promotion_id=$promotion_id&show_id=$show_id&add_match' method='post'>

	<p class='text3'>
<select class='text4' size='20' name='match_type' onchange='showUser(this.value)'>

<option value='1'>1 vs 1</option>

</select></p>

</form>

</div>

</div>

<div style='width: 362px; float: left'>

<div id='result'>
$result
</div>

<div class='line'></div>";

}

<script type="text/javascript">
function showUser(str)
{
if (str=="")
  {
  document.getElementById("result").innerHTML="";
  return;
  } 
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("result").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","promotions.php?promotion_id=$promotion_id&show_id=$show_id&add_match="+str,true);
xmlhttp.send();
}
</script>

Nobody?