JSFiddle - React, Tailwind, and code Playground

by techiedelight

HTML

<label for="pets">Choose your pets:</label>
<select name="pets" id="pets">
  <option value="dog">Dog</option>
  <option value="cat">Cat</option>
  <option value="rabbit">Rabbit</option>
  <option value="parrot">Parrot</option>
  <option value="guinea_pig">Guinea Pig</option>
</select>

<button id="submit">Change Value</button>

CSS

label {
    font-size: 1rem;
    font-family: sans-serif;
    padding-right: 10px;
}

button,
select {
    font-size: .9rem;
    padding: 2px 5px;
}

JavaScript

$(document).ready(function() {
  $('#submit').click(function() {
    $("#pets").prop("selectedIndex", 3);
  })
});