Boutons en PHP : Problème d'indépendance

Bonjour à tous !
Aujourd'hui je rencontre un soucis auquel je n'avais jamais pensé. D'habitude je fais des boutons pour des actions spécifiques, mais là je voudrais une méthode qui créé un bouton quand je l'appelle. Je m'explique :
Mon tableau contient des valeurs, et quand la valeur correspond à "Thermostat" je dois coller un bouton de type Thermostat. Jusqu'à là foreach pas de soucis, l'affichage correspond à ce que je veux. Cependant, les boutons ont tous le même ID et le JavaScript utilise la même variable, à savoir "text"...
Je voudrais savoir si il existait une méthode pour rendre un bouton indépendant, que l'incrémentation n'ajoute pas a tous les boutons, mais qu'au bouton ciblé..
Je laisse mon code juste en dessous.

Merci d'avance !

Thermostat :

	<input type="button" value="-10" onClick="modifier(-10)">
	<input type="text" id="text1" value="0" size="3" readonly="true" style="background-color:#FFFFFF; border:#FFFFFF none 0px; text-align:center; font-size:30px">
	<input type="button" value="+10" onClick="modifier(10)">
</div>

<script language="javascript">
	var valeur=0;
	function modifier(increment) {
	valeur+=increment;
	document.getElementById('text1').value=valeur;
	}
</script>

ON / OFF :

<button class="onoff" onclick="onoff(this)"><div>off</div></button>

var buttonstate=0;
function onoff(element)
{
  buttonstate= 1 - buttonstate;
  var blabel, bstyle, bcolor;
  if(buttonstate)
  {
    blabel="on";
    bstyle="green";
    bcolor="lightgreen";
  }
  else
  {
    blabel="off";
    bstyle="lightgray";
    bcolor="gray";
  }
  var child=element.firstChild;
  child.style.background=bstyle;
  child.style.color=bcolor;
  child.innerHTML=blabel;
}