Non mi funziona backgroundposition

[Draxent]

Scusate ma ho di nuovo lo stesso problema
Questa volta i pulsanti sono 5 e quindi non posso usare la stessa soluzione di prima perchè su qualsiasi pulsante passo mi cambia lo sfondo sempre del primo pulsante.
Quindi ho pensato a questa soluzione ovviamente non funzionante:

<script language="javascript" type="text/javascript">
 function effect(i,varname) { 
   if(varname == "card") button = document.getElementsByClass('card');
   if(varname == "attacks") button = document.getElementByClass('attacks');
   if(varname == "talents") button = document.getElementByClass('talents');
   if(varname == "wardrobe") button = document.getElementByClass('wardrobe');
   if(varname == "description") button = document.getElementByClass('description');
   if(i == 1) button.style.backgroundPosition = "50% top"; 
   if(i == 2) button.style.backgroundPosition = "50% center";
   if(i == 3) button.style.backgroundPosition = "50% bottom";
  }
</script>
<?php
 for($i=0;$i < 5;$i++){
  switch($i){
   case 0: $varname = "card"; break; case 1: $varname = "attacks"; break;
   case 2: $varname = "talents"; break; case 3: $varname = "wardrobe"; break;
   case 4: $varname = "description"; break;
  }
  echo "<td>[img]x.gif[/img]</td>";
 }
?>

Spero sia chiaro
Aiutatemi please!!!