Autosave radio input in local storage translate jquery to vanilla js

Question

This is the code using jQuery to autosave to localstorage when radio input is checked:

    $(document).ready(function(){
        var radios = document.getElementsByName("pages");
        var val = localStorage.getItem('pages');
        for(var i=0;i<radios.length;i++){
          if(radios[i].value == val){
            radios[i].checked = true;
          }
        }
        $('input[name="pages"]').on('change', function(){
          localStorage.setItem('pages', $(this).val());
        
        });
      });

This is where I got in translating to javascript:

    document.addEventListener("DOMContentLoaded", function(){
        var radios = document.getElementsByName("pages");
        var val = localStorage.getItem('pages');
        for(var i=0;i<radios.length;i++){
          if(radios[i].value == val){
            radios[i].checked = true;
          }
        }
        document.getElementsByName('pages').addEventListener("change", function(){
            localStorage.setItem('pages', document.getElementsByName('pages').val());
          });
      });

Don't know how to properly translate

$(this).val());

thus I'm sure at least this line should be corrected:

            localStorage.setItem('pages', document.getElementsByName('pages').val());