如何将单选按钮与输入文本字段绑定？

<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female

<input type="text" id="name" name="name">

var maleRadio = document.querySelector('input[value="male"]');
var femaleRadio = document.querySelector('input[value="female"]');
var nameInput = document.getElementById('name');

maleRadio.addEventListener('change', function() {
  if (this.checked) {
    nameInput.value = 'Male';
  }
});

femaleRadio.addEventListener('change', function() {
  if (this.checked) {
    nameInput.value = 'Female';
  }
});