How do I get values when radio button is checked?

Anupam Mistry

I have three radio buttons with another input. What I want is when I click on any radio button those another input value should be display in the label tag. I try some code but It's not correct.

function displayRadioValue() {
  var ele = document.getElementsByName('plan');  
    for(i = 0; i < ele.length; i++) {
      if(ele[i].checked)
        document.getElementById("investplan").innerHTML = document.getElementById("planinvest").value;
      }
}

<input type="radio" name="plan" checked onclick="displayRadioValue()" />
<input type="text"value="10" id="planinvest1" class="hidden-plan-type">

<input type="radio" name="plan" onclick="displayRadioValue()" />
<input type="text"value="20" id="planinvest2" class="hidden-plan-type">

<input type="radio" name="plan" onclick="displayRadioValue()" />
<input type="text"value="30" id="planinvest3" class="hidden-plan-type">

<label id="investplan"></label>

Carsten Løvbo Andersen

You can use nextElementSibling like in document.getElementById("investplan").innerHTML = ele[i].nextElementSibling.value;

Demo

function displayRadioValue() {
  var ele = document.getElementsByName('plan');
  for (i = 0; i < ele.length; i++) {
    if (ele[i].checked)
      document.getElementById("investplan").innerHTML = ele[i].nextElementSibling.value;
  }
}

<input type="radio" name="plan" checked onclick="displayRadioValue()" />
<input type="text" value="10" id="planinvest1" class="hidden-plan-type">

<input type="radio" name="plan" onclick="displayRadioValue()" />
<input type="text" value="20" id="planinvest2" class="hidden-plan-type">

<input type="radio" name="plan" onclick="displayRadioValue()" />
<input type="text" value="30" id="planinvest3" class="hidden-plan-type">

<label id="investplan"></label>

Collected from the Internet

Please contact [email protected] to delete if infringement.