ajax is messing up colour() please check this if u can

[emopoops]

on your website can u check this PLEASE HELP ME.'
can someone please fix whats wrong with the new problem. i really have no idea how to change it. 2 pages. the problem is when i have the ajax pages and i go to the next page, it doesnt highlight the number im on anymore. and then there was this thing when it highlights another columns or changes it when i specifically have which letter either b, (for background layer) s(for skin) c(clothes) h(hair) and f(for FRONTGROUND/FG) please help heres the pages, i dont know how to get it to highlight one per column like it des on the first page(before i go to the next page by clicking "^".. if u can try the code out for yourself and find the problem. i rreally cant figure it out.

<style>
p{cursor:crosshair;display:inline;}
.bg{background-image: url(bg/0.png);height:343px;width:243px}
.skin{background-image: url(skin/0.png);height:343px;width:243px}
.clothes{background-image: url(clothes/0.png);height:343px;width:243px}
.hair{background-image: url(hair/0.png);height:343px;width:243px;background-repeat:no-repeat;}
.fg{background-image: url(fg/0.png);height:343px;width:243px}</style>
<center>
<br>

<table style="width:600px" cellspacing="0" cellpadding="0" border="0"><tr><td style="height:343px;width:243px;background:#111111">
<table id="bg" class="bg" style="" cellspacing="0" cellpadding="0" border="0"><tr><td valign="top">
<table id="skin" class="skin" style="" cellspacing="0" cellpadding="0" border="0"><tr><td valign="top">
<table id="clothes" class="clothes" style="" cellspacing="0" cellpadding="0" border="0"><tr><td valign="top">
<table id="hair" class="hair" style="" cellspacing="0" cellpadding="0" border="0"><tr><td valign="top">
<table id="fg" class="fg" style="" cellspacing="0" cellpadding="0" border="0"><tr><td></td></tr></table>
</td></tr></table></td></tr></table></td></tr></table></td></tr></table>
</td><td>
<table cellpadding="0" cellspacing="0" border="0" style="width:357px;height:343px;background:#000000;color:white;font-family:arial;font-size:8pt">
<tr>
<td onclick="changea('bg', 'url(hair/00.png)')">xbg</td>
<td onclick="changea('skin', 'url(hair/00.png)')">xskin</td>
<td onclick="changea('clothes', 'url(hair/00.png)')">xclothes</td>
 <td onclick="changea('hair', 'url(hair/00.png)')">xhair</td>
<td onclick="changea('fg', 'url(hair/00.png')">xfg</td>

</tr>
<tr>
<td onclick="pagea('b', 's')">^</td>
<td onclick="pagea('s', 's')">^</td>
<td onclick="pagea('c', 's')">^</td>
<td onclick="pagea('h', 's')">^</td>
<td onclick="pagea('f', 's')">^</td>

</tr>


<tr>

<td><table id="b" style="width:72px" cellspacing="0" cellpadding="0" border="0">
<?php $b = "0"; while($b < 20){ ?>
<tr><td id="b<?php echo $b; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('b<?php echo $b; ?>', 'ssb');changea('bg', 'url(bg/<?php echo $b; ?>.png)')"><?php echo $b; ?></td></tr>
<?php $b++; } ?>
</tr></table></td>

<td><table id="s" style="width:71px" cellspacing="0" cellpadding="0" border="0">
<?php $s = "0"; while($s < 20){ ?>
<tr><td id="s<?php echo $s; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('s<?php echo $s; ?>', 'sss');changea('skin', 'url(skin/<?php echo $s; ?>.png)')"><?php echo $s; ?></td></tr>
<?php $s++; } ?>
</tr></table></td>

<td><table id="c" style="width:71px" cellspacing="0" cellpadding="0" border="0">
<?php $c = "0"; while($c < 20){ ?>
<tr><td id="c<?php echo $c; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('c<?php echo $c; ?>', 'ssc');changea('clothes', 'url(clothes/<?php echo $c; ?>.png)')"><?php echo $c; ?></td></tr>
<?php $c++; } ?>
</tr></table></td>

<td><table id="h" style="width:71px" cellspacing="0" cellpadding="0" border="0">
<?php $h = "0"; while($h < 20){ ?>
<tr><td id="h<?php echo $h; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('h<?php echo $h; ?>', 'ssh');changea('hair', 'url(hair/<?php echo $h; ?>.png)')"><?php echo $h; ?></td></tr>
<?php $h++; } ?>
</tr></table></td>

<td><table id="f" style="width:72px" cellspacing="0" cellpadding="0" border="0">
<?php $f = "0"; while($f < 20){ ?>
<tr><td id="f<?php echo $f; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('f<?php echo $f; ?>', 'ssf');changea('fg', 'url(fg/<?php echo $f; ?>.png)')"><?php echo $f; ?></td></tr>
<?php $f++; } ?>
</tr></table></td>

</tr>
<tr>
<td onclick="pagea('b', 'a')">^</td>
<td onclick="pagea('s', 'a')">^</td>
<td onclick="pagea('c', 'a')">^</td>
<td onclick="pagea('h', 'a')">^</td>
<td onclick="pagea('f', 'a')">^</td>

</tr>
</table>
</td></tr></table>




</center>

<script type="text/javascript">
function pagea(pidea, wha){var pideas = "p" + pidea;var sendea = document.getElementById(pideas).value;
if(wha == "s"){sendea--;}else{sendea++;} document.getElementById(pideas).value=sendea;
var queryString = "?page=" + sendea + "&varea=" + pidea;
	var ajaxRequest;  // The variable that makes Ajax possible!
	
	try{ajaxRequest = new XMLHttpRequest();} catch (e){try{ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {try{ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");} catch (e){alert("Your browser broke!");return false;}}}
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){var ajaxDisplay = document.getElementById(pidea);
			ajaxDisplay.innerHTML = ajaxRequest.responseText;}}
	ajaxRequest.open("GET", "http://www..com/i/c/avitar/ajax.php" + queryString, true);
	ajaxRequest.send(null);  }

function colour(sos, punk){
var valeu = document.getElementById(punk).value;
document.getElementById(valeu).style.color='white';
document.getElementById(punk).value=sos;
document.getElementById(sos).style.color='#555555';
}
function changea(idea, imagea) {
        document.getElementById(idea).style.backgroundImage = imagea;
      }

</script>
<form><input type="hidden" id="ssb" value="ssb"><input type="hidden" id="sss" value="sss"><input type="hidden" id="ssc" value="ssc"><input type="hidden" id="ssh" value="ssh"><input type="hidden" id="ssf" value="ssf">

<input type="hidden" id="pb" value="0"><input type="hidden" id="ps" value="0"><input type="hidden" id="pc" value="0"><input type="hidden" id="ph" value="0">
<input type="hidden" id="pf" value="0">
</form>

the ajax page is really simple, its the thing that runs and once i click on the output td's it doesnt freakin save my spot with the greyed out numbers AKA COLOUR() FUNCTION

<?php $page = mysql_real_escape_string($_GET[page]);
$varea = mysql_real_escape_string($_GET[varea]);
if($varea = "b"){$k = "bg";}
if($varea = "s"){$k = "skin";}
if($varea = "c"){$k = "clothes";}
if($varea = "h"){$k = "hair";}
if($varea = "f"){$k = "fg";}
else{} ?>
<?php $x = $page * 20; $stop = $x + 20;while($x < $stop){ ?>
<tr><td id="<?php echo $varea.$x; ?>" onmouseover="this.style.background='#555555'" onmouseout="this.style.background='#000000'" onclick="colour('<?php echo $varea.$x; ?>', 'ss<?php echo $varea; ?>');changea('<?php echo $k; ?>', 'url(<?php echo $k; ?>/<?php echo $x; ?>.png)')"><?php echo $x; ?></td></tr>
<?php $x++; } ?>

[bluewalrus]

Your if's are wrong your setting the values not comparing them. Use ==.

if($varea == "b"){$k = "bg";}
if($varea == "s"){$k = "skin";}
if($varea =="c"){$k = "clothes";}
if($varea =="h"){$k = "hair";}
if($varea == "f"){$k = "fg";} 

[emopoops]

thank you that makes all of them work but once i click the arrows to go to the next page on the hair column i will click on a new number in that very same hair column, and it wont work. it wont even shade the number gray. let me tell u something else about the hair columrn. when i click back(ajax populates another set of numbers) it only works again if the numbers are between 0 - 19(even if its ajax) WHAT IS GOING ON? do u know im really confused.

[emopoops]

ok its not just the column for hair, sometimes the other ones wont work either. whats the deal?

[bluewalrus]

Do you have a link?

[emopoops]

http://www.socialemo.com/i/c/avitar/index.php

i giess they all start out working until like a few ajax requests or so then they start being faulty one by one.

beware, i dont have many images per column yet i think the most ihave is hair which is in the teens amount. theres like only one bg and fg and like 6 skins

it stil should work with the colour() function right? i mean it works at first but it jsut freaks out @ me.