jQuery не может получить значение от Radio button

[Defrazo]

Доброго времени суток! При написании программы с использованием js столкнулся со следующей проблемой: не могу передать значение от radio button в память localStorage при помощи jQuery. Все остальные элементы (13 штук) были успешно переданы, но только type="radio" не передается. Даже selected через option передалось, но мне нужно использовать именно radio. Бьюсь над проблемой уже часов 5, гугл не особо помогает. Собственно код.
Участок кода с radio кнопками

<div class="field">
<p class="title1 noma">
<b>Ваш пол:</b></p>
<input type="radio" class="inpdata noma rad" name="browser" id="gender" value="man" required> Мужской
<input type="radio" name="browser" value="woman"> Женский<br>
</div>

Последний мой вариант передачи значения с радио кнопок(первоначально пытался использовать аналогию с текстовым полем, но не получалось)

var gender = $('input:radio[name=browser]:checked').val();
gender.value = localStorage.getItem("browser");
genderinp = localStorage.getItem("genderinp");
gender.oninput = function()
 {
 localStorage.setItem('genderinp',gender.value);
 }	
genderinp = localStorage.getItem("genderinp");
console.log("Пол - " + genderinp);

Вот рабочий вариант передачи значения из текстового поля

<div class="field">
<p class="title1">
<b>Ваше отчество:</b></p>
<input type="text" class="inpdata" id="mname" required></input>
</div>

var sname = document.getElementById("sname");
sname.value = localStorage.getItem("sname");
snameinp = localStorage.getItem("snameinp");
sname.oninput = function()
{
localStorage.setItem('snameinp',sname.value);
}	
snameinp = localStorage.getItem("snameinp");
console.log("Фамилия - " + snameinp);

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

[Malleys]

<div class="field">
<p class="title1 noma">
<b>Ваш пол:</b></p>
	<label><input type="radio" class="inpdata noma rad" name="browser" id="gender" value="man" required> Мужской</label>
	<label><input type="radio" name="browser" value="woman"> Женский<br></label>
</div>

<script>

document.addEventListener("click", event => {
	// выведем значение в окошко?
    if(event.target.matches("[name=browser]:checked"))
        alert(`Значение --> ${event.target.value}`);
});

</script>

[рони]

Defrazo,
localStorage.getItem

[Defrazo]

Я попробовал адаптировать вариант, предложенный Malleys, но не совсем удачно получилось

var gender = document.getElementById("gender");
gender.addEventListener("click");
genderinp = localStorage.getItem("genderinp");
if (event.target.matches("[name=browser]:checked")) 
{
localStorage.setItem("genderinp") = $(event.target.value);
}
			
genderinp = localStorage.getItem("genderinp");
console.log("Пол - " + genderinp);

Выходит ошибка
"Uncaught TypeError: Failed to execute 'addEventListener' on 'EventTarget': 2 arguments required, but only 1 present."

[Malleys]

Defrazo, Да всё правильно у вас в 2 строке ошибка, надо обработчик тоже!

<div class="field">
<p class="title1 noma">
<b>Ваш пол:</b></p>
	<label><input type="radio" class="inpdata noma rad" name="browser" id="gender" value="man" required> Мужской</label>
	<label><input type="radio" name="browser" value="woman"> Женский<br></label>
</div>

<script>

document.addEventListener("change", event => {
    if(event.target.matches("[name=browser]:checked")) {
        localStorage.setItem("genderinp", event.target.value);
		
		let gender = localStorage.getItem("genderinp");
		console.log("Пол - " + gender);
	}
});

</script>

[Defrazo]

Malleys, Ваш способ сработал, с двумя но:
1. Значения присваиваются не с первого раза (при клике на кнопку, выполняющую скрипт в console выдает все значения "null", при повторном клике выдает выбранные значения.
2. Если видоизменить код, то при выборе Мужского пола выходит значение "undefined", затем при клике на Женский - "woman", и если кликнуть на Мужской после клика по Женскому, только тогда выходит значение "man"

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

document.addEventListener("click", event => {
if (event.target.matches("[name=browser]:checked")) 
{
localStorage.setItem("genderinp", event.target.value);
}
});
genderinp = localStorage.getItem("genderinp");
console.log("Пол - " + genderinp);

[Defrazo]

С проблемой разобрался. Оказалось, что обработчик начинал слушать только после клика по кнопке "Завершить", которая запускала скрипт, а подразумевалась как записывающая результат.
Все операции, которые слушали и заносили результат в localStorage были вынесены в другой скрипт, который работал по $(document).ready и тогда все стало пучком) Спасибо за помощь