JSFiddle - React, Tailwind, and code Playground

HTML

<select class="day" name="dobDay">
    <option value="1" selected>1</option>
    <option value="2">2</option>
</select>
<select class="month" name="dobMonth">
    <option value="1" selected>Jan</option>
    <option value="2">Feb</option>
    <option value="3">Mar</option>
    <option value="4">Apr</option>
    <option value="5">May</option>
    <option value="6">Jun</option>
    <option value="7">Jul</option>
</select>
<select class="year" name="dobYear">
</select>

JavaScript

for (var i = 1900; i < 2012; i++) {
    $('<option>').attr('value', i).text(i).appendTo('.year');
}

function monthChanged() {
    var days = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
    var month = $('.month').val() - 1,
        year = +$('.year').val();

    // Check for leap year if Feb
    if (month == 1 && new Date(year, month, 29).getMonth() == 1) days[1]++;

    // Add/Remove options
    if ($('.day option').length > days[month] + 1) {
        // Remove
        $('.day option').slice(days[month] + 1).remove();
    } else if ($('.day option').length < days[month] + 1) {
        // Add
        for (var i = $('.day option').length; i <= days[month]; i++) {
            $('<option>').attr('value', i).text(i).appendTo('.day');
        }
    }
}

$(function () {
    monthChanged(); // On document ready
    $('.month').change(monthChanged); // On month change
    $('.year').change(monthChanged); // On year change (for leap years)
});