Salve a tutti ho un grosso problema che non riesco a risolvere da due giorni.
Praticamente ho creato una pagina html in cui ci sono una serie di prodotti ad ognuno dei quali è associato un capo input hidden e due bottoni con cui incrementare il numero di pezzi da acquistare.
Fin qui tutto bene, ma il problema è che quando si clicca per la prima volta su di un prodotto vorrei far apparire in un div una stringa corrispondente al codice del prodotto con il prezzo moltiplicato per il numero di pezzi e se l'utente fa tornare il contatore a zero la stringa deve sparire.
Ora vi posto il codice vi prego datemi una mano è urgente ed importante.

Codice HTML :
Codice PHP:
<ul>[*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)" target="_blank">
        [img]Immagini/0057a.jpg[/img]
        
001</a>

        <input type="text" size="5" id="fi001" name="fi001" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('fi001', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('fi001', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
002</a>

        <input type="text" size="5" id="fi002" name="fi002" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('fi002', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('fi002', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
003</a>

        <input type="text" size="5" id="ma001" name="ma001" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('ma001', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('ma001', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
004</a>

        <input type="text" size="5" id="ma002" name="ma002" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('ma002', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('ma002', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
005</a>

        <input type="text" size="5" id="fr001" name="fr001" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('fr001', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('fr001', 0)"> - </button>
      
        .
        .
        .
        .
        .
        .
        .        
15</a>

        <input type="text" size="5" id="sc001" name="sc001" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('sc001', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('sc001', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
16</a>

        <input type="text" size="5" id="sc002" name="sc002" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('sc002', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('sc002', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
17</a>

        <input type="text" size="5" id="sp001" name="sp001" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('sp001', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('sp001', 0)"> - </button>
      [*]
        <h1>Margherita</h1>
        <a href="javascript:void(0)">
        [img]Immagini/0057a.jpg[/img]
        
18</a>

        <input type="text" size="5" id="sp002" name="sp002" disabled="disabled" value="0" />

        <button type="button" value="incremento" title="Aggiungi" id="****" onclick="calcolo('sp002', 1)"> + </button>
        <button style="margin-left:.5em;" type="button" value="decremento" title="Diminuisci" id="****" onclick="calcolo('sp002', 0)"> - </button>
      [/list]
  </div>  
  <div id="risultati">
    <h1>Carello</h1>
    

Elenco prodotti</p><p id="lista"></p>

   [COLOR=red]qua deve apparire la stringa e le successive[/COLOR] 
Codice JAVASCRIPT:
Codice PHP:
function calcolo (codice, bool)
{

var vettore = new Array( document.getElementById("fi001").value, document.getElementById("fi002").value, document.getElementById("ma001").value, document.getElementById("ma002").value, document.getElementById("fr001").value, document.getElementById("fr002").value, document.getElementById("bq001").value, document.getElementById("bq002").value, document.getElementById("in001").value, document.getElementById("in002").value, document.getElementById("co001").value, document.getElementById("co002").value, document.getElementById("bo001").value, document.getElementById("bo002").value, document.getElementById("sc001").value, document.getElementById("sc002").value, document.getElementById("sp001").value, document.getElementById("sp002").value);

var id = new Array( document.getElementById("fi001"), document.getElementById("fi002"), document.getElementById("ma001"),document.getElementById("ma002"), document.getElementById("fr001"), document.getElementById("fr002"), document.getElementById("bq001"), document.getElementById("bq002"), document.getElementById("in001"), document.getElementById("in002"), document.getElementById("co001"), document.getElementById("co002"), document.getElementById("bo001"), document.getElementById("bo002"), document.getElementById("sc001"), document.getElementById("sc002"), document.getElementById("sp001"), document.getElementById("sp002") );

var prezzi = new Array(2.30, 1.80, 4.6, 3.5, 2.5, 2.30, 1.80, 4.6, 3.5, 2.5, 2.30, 1.80, 4.6, 3.5, 2.5, 2.30, 1.80, 4.6);
     
if(bool == 1)
{
     for(i = 0; i < id.length; i++)
     {
         if(id[i].id == codice)
         {
            document.getElementById(id[i].id).value = parseInt(vettore[i]) + 1;
            if(document.getElementById(id[i].id).value == 1)
            {
                  var elemento = document.getElementById("lista");
                var prezzo = document.getElementById(id[i].id).value * prezzi[i];
                var testo = codice + ' : ' + prezzo;
                var newtesto = document.createTextNode(testo);
                elemento.appendChild(newtesto);
            }
            else
            {
                //aggiorna solo il valore del prezzo
            }
         }
     }
}
else
{
    for(i = 0; i < id.length; i++)
     {
         if(id[i].id == codice)
         {
            if(document.getElementById(id[i].id).value == 0) break;
            document.getElementById(id[i].id).value = parseInt(vettore[i]) - 1;
            //if(document.getElementById(id[i].id).value == 1)
            //{
            //    elemento.removeChild(newtesto);
            //}
         }
     }
}
}