[Nexus]

Почему никто не вспомнил про тэг «label»?

<form id="test-form">      
     <label><input type="radio" name="radio-button" value="r-first">Радио 1</label>
     <label><input type="radio" name="radio-button" value="r-second">Радио 2</label>
     <label><input type="radio" name="radio-button" value="r-third">Радио 3</label>

     <input type="submit" value="Обработать">
</form>
             
    <script>
        const form = document.querySelector('#test-form');
        form.addEventListener('submit', function (event) {  
            event.preventDefault();

            const radioButtons = this.querySelectorAll('[name="radio-button"]'); 
            let x1;        
                for (let i=0; i<radioButtons .length; i++) {
                    if (radioButtons [i].checked) {
                        x1 = radioButtons[i].parentNode.textContent;                       
                    }
                } 

            alert(x1);
        });
    </script>