JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select name="" id="fromCity">

</select>

JavaScript

var listCity =
  {
    "Popular":
    [
       {"cityname":"London","code":"LDN"},
       {"cityname":"Rome","code":"ROM"},
       {"cityname":"Madrid","code":"MDR"}
    ],
     "Germany":
    [
       {"cityname":"Hamburg", "code":"HMB"},
       {"cityname":"Frankfurt", "code":"FRN"}
     ]}

var a = $("select#fromCity").val();
listKota.forEach(function(e){
   a.append('<optgroup label="'+Popular+'"><option value="'+ listCity.code +'">'+ listCity.cityname +'</option></optgroup>');});