Как менять текст при выборе инпута?

Большое спасибо за ответ! Решение работает, но я у меня значение value везде разные и менять их нельзя.
Пробовал через data-. Но все равно выбирает одно значение, последнее.

document.addEventListener('click', function(e) {
	var el = document.querySelector('#text-<?php echo $peremennaya; ?>');
  if (e.target.type === 'radio' ) {
    e.target.closest('.capt').querySelector('.bl').textContent = el.dataset.newtext;
  }
});

Попробуйте объяснить, что там у вас не так ещё раз. Я ничего не понял.

есть несколько блоков на странице, в каждом блоке свои инпуты radio, после нажатия на инпут меняется текст в своем блоке.
нашел еще в интернете решение, добавил, в итоге вышло такое

<script>
document.addEventListener('click', function(e) {
$('#option_'+<?php echo $pr; ?>+' option:selected, #option_'+<?php echo $pr; ?>+' input:checked').each(function() {	
  if (e.target.type === 'radio' ) {
    e.target.closest('.capt').querySelector('.bl').textContent = $(this).attr('data-pr');
  }
})
}
);</script>

это работает нормально почти. но когда переключаешь инпуты в самом последнем блоке, то другие блоки уже меняют значение на то, которое выбрали в последнем блоке.

Яснее не стало. Давайте-ка вы воспроизведёте свою проблему в песочнице.

0xD34F, вот так у меня https://codepen.io/AlekseiD88/pen/mZNRVo
Нажмите в опциях первого блока, потом второго. и снова первого блока и увидите

Ну и зачем было так делать? Зачем второй обработчик? Да и в целом - дичь какая-то. Можно же проще:

document.addEventListener('change', function(e) {
  const pr = e.target.dataset.pr;
  if (pr) {
    e.target.closest('.caption').querySelector('.pri').textContent = pr;
  }
});

0xD34F, да я только учусь, как смог, так и делал. По вашему примеру все работает. Огромное спасибо!