Вывод JS

Здравствуйте, сегодня уже помогли по JS, но появилась новая проблема. Заранее спасибо всем откликнувшимся. Есть следующий код:

<script>
    var current = "one";

var radio = document.getElementsByClassName("radio");
for(var i=0; i<radio.length; i++) {
    radio[i].addEventListener("change", function(e) {
    document.getElementsByClassName(current)[0].style.display = "none";
      document.getElementsByClassName(e.target.value)[0].style.display = "block";
    current = e.target.value;
  });
}
</script>
<style>
.one {
  display:block;
 
}
.two {
  display:none;
 
}
.three {
  display:none;
 
}
</style>
<label>
                        <input type="radio" name="radion" checked  value="one" class="radio" />Один
            </label>
          <label>
                        <input type="radio" name="radion"  value="two" class="radio" />Два
                        </label>
          <label>
                        <input type="radio" name="radion"  value="three" class="radio" />Три
            </label>
           
           

Его задача, выводить значения в зависимости от выбранного варианта (radio). Код работает, но проблема в следующем, если я в другом месте выведу те же самые инпуты но с другими значениями, скрипт меняет только в первых инпутах, т.е. вот это уже работать не будет:

<label>
                        <input type="radio" name="radion" checked  value="one" class="radio" />Яблоко
            </label>
          <label>
                        <input type="radio" name="radion"  value="two" class="radio" />Апельсин
                        </label>
          <label>
                        <input type="radio" name="radion"  value="three" class="radio" />Груша
            </label>

Выведется в зависимости от выбранного radio (Один / Два  / Три) а (Яблоко / Апельсин / Груша) не сработает. Подскажите как сделать так чтобы в зависимости от выбранного варианта выводились и фрукты и цифры) Заранее всем спасибо кто хоть что то подскажет!