View Full Version : changing text with innerhtml javascript

10-12-2012, 12:28 PM
ok, so I have got this working slighlty but cannot get it to change more than once. I have 3 radio buttons with a primary selected at default and is display the value for this primary button which is $9.99. I want to change the $9.99 to $15.98 for the second radio button and $20.98 for the third radio button and back again to radio button 1 and 2 etc.

here is my code

<script type="text/javascript">
function changeText1(){
document.getElementById('buy-1x-power-out').innerHTML = '$9.99 USD';
function changeText2(){
document.getElementById('buy-2x-power-out').innerHTML = '$15 USD';
function changeText3(){
document.getElementById('buy-3x-power-out').innerHTML = '$20.47 USD';

<form name="power-out-form" method="post" action="">
<input name="power-out-buy-selection" type="radio" id="power-out-buy-selection_0" value='$9.99' checked onclick='changeText1()'>
1 @ $9.99 USD</label>
<input type="radio" name="power-out-buy-selection" value='$15.98' id="power-out-buy-selection_1" onclick='changeText2()'>
2 @ $7.99 USD (20% Off)</label>
<input type="radio" name="power-out-buy-selection" id="power-out-buy-selection_2" onclick='changeText3()' value='$20.97' >
3 @ $6.99 USD (30% Off)</label>

<p>total</p> <p id="buy-3x-power-out">$9.99 USD</p>