JSFiddle - React, Tailwind, and code Playground

by Shabeer Sheffa

HTML

<a href="#e" class="areaselect" rel="region_7" id="eastern" title="Eastern England image">Eastern England</a>
<a href="#" class="areaselect" rel="region_8" id="western" title="Western England image">Western England</a>

<select name='areapick' id='apick' class='apick'>    
    <option value='placec'>Placec</option>
    <option value='placed'>Placed</option>    
    <option value='placee'>Placee</option>
</select>

CSS

.apick{
    display:none;
}

JavaScript

$('#eastern').click(function() {
    var a =$('.apick').css('display','block')
        alert(a);
        
    $('#apick').append("<option value='placea'>Placea</option>");
    $('#apick').append("<option value='placeb'>Placeb</option>");
  //alert("Handler for .click() called.");
});

$('#western').click(function() {
    $('.apick').css('display','block')
    $('#apick').append("<option value='placea'>Placea</option>");
    $('#apick').append("<option value='placeb'>Placeb</option>");
  //alert("Handler for .click() called.");
});