Your problem is that you are using document.querySelector() so you are only selecting the first instance of your input. What you need to do instead is use document.querySelectorAll() to select all 4 of them. You then need to loop through them and add the event listener to each like this:

const element2 = document.querySelectorAll('input[name=elegirparadalist]'),
elemArray = Array.from(element2);
elemArray.forEach( (elem) => {
elem.addEventListener('change', () => {
 if (elem.checked) console.log(elem.value);
  });
});

There is a working demo here:
[jsfiddle.net...]

Thanks, however does not work. Also I am not sure if I don't understand, but I can't see it working on fiddle?
Thanks again

Wow, Helen, haven’t seen you in ages!

:: quick look at only place I can remember currently using this, with cut-and-paste ::

thisvalue = startingvalue;
checker = document.getElementsByName("elegirparadalist");
 if (checker[0].checked)
 { thisvalue = checker[0].value; }
 else if (checker[1].checked)
 { thisvalue = checker[1].value; }

This is for a scenario where there are only ever exactly three options. If you’ve got a whole lot of radio buttons, or if the number of them can change at a moment’s notice, put it in a for(blahblah) loop using

document.getElementsByName("elegirparadalist").length

I had to sneak over to w3schools to refresh my memory on this point because all I could remember is that javascript and php use different terms--the latter has “count”--which confuses me every time.

Thanks Lucy,
You right, have not been in here much.

Just put the html to do it simple.
Honestly it is in a loop and there may be many radio buttons.
And I need to run a function if a radio button is checked:

var element2 = document.querySelector('input[name="elegirparadalist"]');
 element2.addEventListener('click', () => {
 defineListenerlist()
 })

 function defineListenerlist() {
 // Get the checkbox
 var radiobutton = document.querySelector('input[name="elegirparadalist"]
 // Get the output text
 var text = document.getElementById("elegidotexto");

 // If the checkbox is checked, display the output text
 if (radiobutton.checked == true){
 text.style.display = "block";
 } else {
 text.style.display = "none";
 }
 document.getElementById("elegidotexto2").innerHTML = document.querySelector('input[name="elegirparadalist"]:checked ~ input[name="paradaxlist"]').value;
 document.getElementById("puntorecoger").value= document.querySelector('input[name="elegirparadalist"]:checked ~ input[name="paradaxlist"]').value;
 document.getElementById("pickupoint").value = document.querySelector('input[name="elegirparadalist"]:checked ~ input[name="idparadalist"]').value;  
 }

Uupps, I had my html wrong,

NickMNS

this works perfectly, thanks!

const element2 = document.querySelectorAll('input[name=elegirparadalist]'),
elemArray = Array.from(element2);
elemArray.forEach( (elem) => {
elem.addEventListener('change', () => {
 if (elem.checked) console.log(elem.value);
 });
});

And the fiddle also...thanks again, hopefully this will work.

@helenp there is one caveat, that your likely aware of but it definitely worth pointing out, that is the JS code used in your original post and my solution is ES6 (arrow notation, and Array.from). This is only supported in modern browsers and not at all by Internet Explorer.

UUps. no I did not know.
Any workaround to this?
Thanks

Also, actually I need to be able to get the values of 3 inputs in the same loop, so maybe I should put in the array a div with the inputs?

<div id="list">
<div class="testclass">
<input type="radio" value="1" name="elegirparadalist" class="elegirparadalist">
<label for="elegirparadalist"></label>
<input type="hidden" value="" name="paradaxlist" class="paradaxlist">
<input type="hidden" value="" name="idparadalist" class="idparadalist">
</div>
<div class="testclass">
etc.

Here is the IE compatible solution:
demo: [jsfiddle.net...]

var element2 = document.querySelectorAll('input[name=elegirparadalist]');
Array.prototype.forEach.call(element2, function (elem) {
 elem.addEventListener('change', function() {
  if (this.checked) {
   console.log("checkbox value is:", this.value)
  }
 });
});

hmm
just got an idea, instead of having the hidden inputs in the loop add the values of the hidden to the radio button and then split them.
This works, is it a good idea?
At least a lot easier

<input type="radio" value="1~2" name="elegirparadalist" class="elegirparadalist">
<input type="radio" value="3~4" name="elegirparadalist" class="elegirparadalist">

var element2 = document.querySelectorAll('input[name=elegirparadalist]');
Array.prototype.forEach.call(element2, function (elem) {
 elem.addEventListener('change', function() {
 if (this.checked) {
var fields = this.value.split('~');
var paradaxlist = fields[0];
var idparadalist = fields[1];
alert(paradaxlist)
alert(idparadalist)
 }
 });
});

Thanks for all help