jquery - How to set selected option to default selected in Javascript -

i have select option materialize style, in select option want check value of option exist in database or not.

html code :

<div class="row margin">    <div id="input-select" class="section">        <label>supir</label>           <select name="id_personalia" id="id_personalia" onchange="cek_supir()">               <option id="default_supir" value="default_supir" disabled selected>pilih supir</option>                <?php                  foreach ($supir $s) {                 ?>                  <option value="<?= $s->id_personalia; ?>"> <?= $s->nama_ktp . " " . $s->id_personalia; ?> </option>                 <?php                 }                 ?>           </select>      </div> </div> 

javascript code :

<script> function cek_supir() {     var supir = document.getelementbyid("id_personalia").value;     var data = <?php echo json_encode($stat_supir) ?>;      (var = 0; < data.length; i++) {         if (supir == data[i]) {             $("#id_personalia").val('default_supir');             materialize.toast('supir sedang bertugas', 3500);             //document.getelementbyid("default_supir").selected = true;             //document.getelementbyid("id_personalia").selected = false;         }     } } 

the problem select option can't set selected option.

the materialize select overrides browser default, when change value in select element, need update component, using .material_select():

function cek_supir() {     var supir = document.getelementbyid("id_personalia").value;     var data = <?php echo json_encode($stat_supir) ?>;      (var = 0; < data.length; i++) {         if (supir == data[i]) {             $("#id_personalia").val('default_supir');             $("#id_personalia").material_select();             materialize.toast('supir sedang bertugas', 3500);         }     } } 

see docs more info.