How to get value of selected radio button

We want to get the selected or checked value from a group of radio buttons. In the following example we show 3 possible cases.

In the first one the value of the checked radio input is collected.
The second one shows the value of each of the input radius.
The third one shows the value of the clicked input radius.

<div>
  <input type="radio" class="rating" name="rating" value="Value 1"> Value 1
  <input type="radio" class="rating" name="rating" value="Value 2"> Value 2
  <input type="radio" class="rating" name="rating" value="Value 3" checked> Value 3
</div>
<hr>
<script>
  //Value of a previously checked item
  var value_radio = document.querySelector('input[name="rating"]:checked').value;
  console.log('Part 1');
  console.log('Checked Element: '+value_radio);
  document.querySelector('input[name="rating"]:checked').value
  
  //If we want to obtain the value of each input regardless of whether the element is checked
  console.log('Part 2');
  console.log('Value each Element');
  document.querySelectorAll('.rating').forEach(element => console.log(element.value));
  
  //If we want to know when one of the elements is clicked and its value
  console.log('Part 3');
  document.querySelectorAll('.rating').forEach(
    el => {
      el.addEventListener('click', () => {
        console.log("Element clicked: "+el.value);
      });
    });
</script>