JSFiddle - React, Tailwind, and code Playground
HTML
<select id="country" name="country">
<option value=""></option>
<option value="1">Afghanistan</option>
<option value="3">Albania</option>
<option value="11">Argentina</option>
<option value="12">Armenia</option>
<option value="14">Australia</option>
<option value="15">Austria</option>
<option value="16">Azerbaijan</option>
<option value="21">Belarus</option>
<option value="22">Belgium</option>
<option value="29">Bosnia and Herzegovina</option>
<option value="32">Brazil</option>
<option value="35">Bulgaria</option>
<option value="40">Canada</option>
<option value="45">Chile</option>
<option value="46">China</option>
<option value="49">Colombia</option>
<option value="56">Croatia</option>
<option value="59">Cyprus</option>
<option value="60">Czech Republic</option>
<option value="61">Denmark</option>
<option value="70">Estonia</option>
<option value="75">Finland</option>
<option value="76">France</option>
<option value="78">French Polynesia</option>
<option value="82">Georgia</option>
<option value="83">Germany</option>
<option value="86">Greece</option>
<option value="100">Hong Kong</option>
<option value="101">Hungary</option>
<option value="102">Iceland</option>
<option value="103">India</option>
<option value="104">Indonesia</option>
<option value="105">Iran, Islamic Republic of</option>
<option value="106">Iraq</option>
<option value="107">Ireland</option>
<option value="109">Israel</option>
<option value="110">Italy</option>
<option value="112">Japan</option>
<option value="115">Kazakhstan</option>
<option value="118">Korea, Democratic People's Republic of</option>
<option value="119">Korea, Republic of</option>
<option value="123">Latvia</option>
<option value="124">Lebanon</option>
<option value="129">Lithuania</option>
<option value="135">Malaysia</option>
<option value="136">Maldives</option>
<option value="144">Mexico</option>
<option value="146">Moldova,...
JavaScript
$(document).ready(function(){
var shows = [];
var $country = $("#country");
var $stats = $("#count #stats");
$.get("http://api.tvmaze.com/shows", function (data) {
shows = data;
showsByCountry();
});
function showsByCountry() {
var country = $country.find("option:selected").text();
var filtered;
if (country != "") {
filtered = jQuery.grep(shows, function(show, index) {
platform = show.network || show.webChannel;
return platform != undefined && platform.country != null && platform.country.name === country;
});
$stats.text(filtered.length + " out of " + shows.length + " shows in " + country);
}
else {
$stats.text(shows.length + " shows");
}
}
$country.change(showsByCountry);
});