JSFiddle - React, Tailwind, and code Playground

HTML

<select name="user_dept" id="user_dept">
  <option value="CC162981256010950">local1</option>
  <option value="CC162981257010951">local2</option>
  <option value="CC162981257010952">local3</option>
  <option value="CC162981257010953">local4</option>
  <option value="CC163271427011230">local5</option>
</select>

JavaScript

$.ajax({
  cache: false,
  url: 'ldap_lib.php',
  data:'mode=findLDAPServerInfo&ldapid=<?php echo $target_lid; ?>',
  type:'POST',
  dataType:'json',
  success: function(val){
    UserDept();
    UserRole();
    GlobalDept();
    $('#mode').val('editLDAPServer');
    $('#l_name').val(val[0].l_name);
    $('#l_desc').val(val[0].l_desc);
    $('#l_ip1').val(val[0].l_ip1);
    $('#l_port1').val(val[0].l_port1);
    $('#l_ip2').val(val[0].l_ip2);
    $('#l_port2').val(val[0].l_port2);
    $('#l_domainname').val(val[0].l_domain);
    $('#l_loginname').val(val[0].l_loginname);
    $('#l_loginpwd').val(val[0].l_loginpwd);
    $('#l_mobile').val(val[0].l_mobile);
    $('#l_basedn').val(val[0].l_basedn);
    $('#l_filter').val(val[0].l_filter);
    $('#l_type').val(val[0].l_type);
    $('#l_loginmode').val(val[0].l_loginmode);
    $('#l_scope').val(val[0].l_scope);
    $('#sync_frequency').val(val[0].sync_frequency);
    $('#sync_time').val(val[0].sync_hour);

    if(val[0].sync_ul == 't'){
      $('#l_sync_ul').prop('checked', true);
      $('#tip_ul_dept').attr('style','display:block');
      var user_dept = val[0].user_dept;
      var user_role = val[0].user_role;
      
      // #user_dept has no options here because the getJSON call in
      // UserDept() hasn't returned (it's asynchronous)
      console.log($("#user_dept option"));
    } else{
      $('#l_sync_ul').prop('checked', false);
      $('#tip_ul_dept').attr('style','display:none');
    }
    if(val[0].sync_gab == 't'){
      $('#l_sync_gab').prop('checked', true);
      $('#tip_gab_dept').attr('style','display:block');
      // $('#gab_dept').val(val[0].gab_dept);
    } else{
      $('#l_sync_gab').prop('checked', false);
      $('#tip_gab_dept').attr('style','display:none');
    }
  },
  error: function(){
    alert('Failed To Retrieve Server');
  }
});

function UserDept()
{
  $.getJSON('user_management_lib.php?mode=getDepartmentList', function(data){
    var list = [];
    $.each(data, function(index,...