JSFiddle - React, Tailwind, and code Playground
HTML
<select id = "mySelect" style = "width: 0px;">
<option value = "yes">Yes</option>
<option value = "no">nooooooooooooo</option>
<option value = "this is extra long text ">this is extra long text</option>
</select>
<button>test</button>
JavaScript
$(document).ready(function() {
$("button").click(function() {
var longest = 0;
$("select option").each(function() {
var opt_length = $(this).text().length();
longest = (opt_length > longest) ? opt_length : longest;
});
console.log(longest);
$("select").animate({
width: longest/4 + "em"},
"slow");
});
});