JSFiddle - React, Tailwind, and code Playground

by zazvorniki

HTML

<p>Animal Breed <span class='requiredIndication'>*</span></p>
 <select required id='animalBreed' name='animalBreed'></select>

CSS

select{
  width:100%;
}

JavaScript

$(document).ready(function () {

  
  var url = "https://lostpetposters.org/json/dogs.json;"

    $("#animalBreed").empty();
    $("#animalBreed").append('<option selected="true" disabled></option>');

    // Populate dropdown with list of provinces
    $.getJSON(url, function (data) {
        console.log(data)
        $.each(data, function (key, entry) {
            $('#animalBreed').append($('<option></option>').attr('value', entry.name).text(entry.name));
        })
    });
});