JSFiddle - React, Tailwind, and code Playground

HTML

<form id="form">
    <label for="state">State</label>
    <select id="select" required>
        <option></option>
    </select>
</form>

<div id="status">
</div>

CSS

select:invalid, input:invalid {
    color: rgb(185, 74, 72);
    border-color: rgb(238, 95, 91);
}

JavaScript

$('#status').append('<p>' + $('#form').is(function(){ return this.checkValidity();}));

$('#select option').val('n/a').text('N/A').attr('selected', true);

$('#status').append('<p>' + $('#form').is(function(){ return this.checkValidity();}));

$('#select option').replaceWith("<option value='n/a' selected='selected'>N/A</option>");

$('#status').append('<p>' + $('#form').is(function(){ return this.checkValidity();}));