JSFiddle - React, Tailwind, and code Playground

by Good Muyis

HTML

<select class="form-control" name="embassyLocation" id="embassyLocation">
  <option selected disabled> - Select a Service - </option>
</select>
<input type="radio" name="serv" value="Regular">Regular
<input type="radio" name="serv" value="Premium">Premium
<hr>
<input type="radio" name="region" value="Africa">Africa
<input type="radio" name="region" value="World">World
<div class="fees"></div>

JavaScript

jQuery(document).ready( function($){
let rawJSON = [{"FEES_ID":"NIN001","SERVICE_DESCRIPTION":"ENROLMENT & NIN ISSUANCE: PERSONS 16 YEARS OF AGE AND ABOVE","AFRICAN_REG":30,"AFRICAN_PREM":40,"WORLD_REG":50,"WORLD_PREM":70},{"FEES_ID":"NIN002","SERVICE_DESCRIPTION":"ENROLMENT & NIN ISSUANCE: PERSONS BELOW 16 YEARS OF AGE","AFRICAN_REG":20,"AFRICAN_PREM":25,"WORLD_REG":40,"WORLD_PREM":50},{"FEES_ID":"NIN003","SERVICE_DESCRIPTION":"NIN SLIP RE-ISSUE","AFRICAN_REG":3,"AFRICAN_PREM":5,"WORLD_REG":5,"WORLD_PREM":10},{"FEES_ID":"NIN004","SERVICE_DESCRIPTION":"NIN VALIDATION","AFRICAN_REG":5,"AFRICAN_PREM":10,"WORLD_REG":10,"WORLD_PREM":15},{"FEES_ID":"NIN005","SERVICE_DESCRIPTION":"NIN & DEMOGRAPHIC DATA VERIFICATION","AFRICAN_REG":10,"AFRICAN_PREM":10,"WORLD_REG":15,"WORLD_PREM":20},{"FEES_ID":"NIN006","SERVICE_DESCRIPTION":"NIN & BIOMETRIC DATA VERIFICATION","AFRICAN_REG":15,"AFRICAN_PREM":15,"WORLD_REG":25,"WORLD_PREM":30},{"FEES_ID":"NIN007","SERVICE_DESCRIPTION":"MODIFICATION OF ALL FIELDS OTHER THAN DATE OF BIRTH (DAY/MONTH/YEAR)","AFRICAN_REG":5,"AFRICAN_PREM":5,"WORLD_REG":10,"WORLD_PREM":15},{"FEES_ID":"NIN008","SERVICE_DESCRIPTION":"CORRECTION OF DATE OF BIRTH (DAY/MONTH/YEAR)","AFRICAN_REG":35,"AFRICAN_PREM":40,"WORLD_REG":35,"WORLD_PREM":45},{"FEES_ID":"NIN009","SERVICE_DESCRIPTION":"GMPCARD ISSUANCE RE-ISSUANCE & ACTIVATION","AFRICAN_REG":35,"AFRICAN_PREM":40,"WORLD_REG":35,"WORLD_PREM":35},{"FEES_ID":"NIN010","SERVICE_DESCRIPTION":"GMPCARD NUMBER AUTHENTICATION","AFRICAN_REG":10,"AFRICAN_PREM":10,"WORLD_REG":20,"WORLD_PREM":20},{"FEES_ID":"NIN011","SERVICE_DESCRIPTION":"RE- ISSUANCE OF PIN FOR ISSUED CARD ON PAPER","AFRICAN_REG":5,"AFRICAN_PREM":5,"WORLD_REG":5,"WORLD_PREM":5},{"FEES_ID":"NIN012","SERVICE_DESCRIPTION":"REQUEST FOR WRITTEN CERTIFICATION/CONFIRMATION OF IDENTITY (INCLUSIVE OF DELIVERY BY REGISTERED COURIER)","AFRICAN_REG":75,"AFRICAN_PREM":75,"WORLD_REG":75,"WORLD_PREM":75},{"FEES_ID":"NIN013","SERVICE_DESCRIPTION":"ENROLMENT SYSTEM...