I'mtryingtousethefunctiontochangebetween4imagesthroughclicksoncertainlinks.Howeverwhileoneimageappears,theother3alsoappearasafieldtobefilled.Iwouldliketoshowonlyone.Iwouldalsoliketoputtextinthepricefieldthatwillvaryaccordingtotheimage.
function mudaImagem(i) {
if (i == 1) {
document.getElementById("imagem1").src = "Dulce_GustoP.jpg";
document.getElementById("imagem2").src = "Nespresso_InissiaP_not.jpg";
document.getElementById("imagem3").src = "Nespresso_C50P_not.jpg";
document.getElementById("imagem4").src = "SenseoP_not.jpg";
} else if (i == 2) {
document.getElementById("imagem1").src = "Dulce_GustoP_not.jpg";
document.getElementById("imagem2").src = "Nespresso_InissiaP.jpg";
document.getElementById("imagem3").src = "Nespresso_C50P_not.jpg";
document.getElementById("imagem4").src = "SenseoP_not.jpg";
} else if (i == 3) {
document.getElementById("imagem1").src = "Dulce_GustoP_not.jpg";
document.getElementById("imagem2").src = "Nespresso_InissiaP_not.jpg";
document.getElementById("imagem3").src = "Nespresso_C50P.jpg";
document.getElementById("imagem4").src = "SenseoP_not.jpg";
} else if (i == 4) {
document.getElementById("imagem1").src = "Dulce_GustoP_not.jpg";
document.getElementById("imagem2").src = "Nespresso_InissiaP_not.jpg";
document.getElementById("imagem3").src = "Nespresso_C50P_not.jpg";
document.getElementById("imagem4").src = "SenseoP.jpg";
}
}
<tr>
<th class="colTH">Dolce Gusto</th>
<td><a id="colTD" onclick="mudaImagem(1)" onclick="mudaTexto(1)">Piccolo</a>
</td>
<td rowspan="4">
<img id="imagem1" onclick="mudaImagem(1);" />
<img id="imagem2" onclick="mudaImagem(2);" />
<img id="imagem3" onclick="mudaImagem(3);" />
<img id="imagem4" onclick="mudaImagem(4);" />
</td>
<td rowspan="4">
<img id="texto1" onclick="mudatexto(1);" />
<img id="texto2" onclick="mudatexto(2);" />
<img id="texto3" onclick="mudatexto(3);" />
<img id="texto4" onclick="mudatexto(4);" />
</td>
</tr>
<tr>
<th rowspan="2" class="colTH">Nespresso</th>
<td><a id="colTD" onclick="mudaImagem(2)">Inissia C40</a>
</td>
</tr>
<tr>
<td><a id="colTD" onclick="mudaImagem(3)">U C50</a>
</td>
</tr>
<tr>
<th class="colTH">Senseo</th>
<td><a id="colTD" onclick="mudaImagem(4)">HD7811/96</a>
</td>
</tr>