JSFiddle - React, Tailwind, and code Playground
HTML
<a href="#">before</a>
<select id="myselect">
<option>One</option>
<option>Two</option>
<option style="display:none">Three</option>
<option>Four</option>
<option>Five</option>
<option>Six</option>
<option>Seven</option>
</select>
<a href="#">after</a>
JavaScript
jQuery(document).ready(function () {
var first = jQuery('#myselect').find('option').first();
jQuery('#myselect').on('focus', function (e) {
first.remove();
}).on('blur', function (e) {
jQuery(this).find('option').first().before(first);
});
});