我无法在jQuery中访问集合类型单选按钮值

<input type="radio" name="gender" class="radio-button" value="male"> Male
<input type="radio" name="gender" class="radio-button" value="female"> Female
<input type="radio" name="gender" class="radio-button" value="other"> Other

<button id="getSelectedValue">Get Selected Value</button>

$(document).ready(function(){
  $('#getSelectedValue').click(function(){
    var selectedValue = $('.radio-button').filter(function(){
      return this.checked;
    }).val();
    
    alert('Selected value: ' + selectedValue);
  });
});