JSFiddle - React, Tailwind, and code Playground

HTML

<div id="select_id">
   <select name="androidSelect" >
     <option value="Select Option" orig="Select Option">Select Option</option>
     <optgroup label="Android"></optgroup>
       <optgroup label="Android"></optgroup>
       <optgroup label="Android"></optgroup>
       <optgroup label="Android"></optgroup>
     <option value="Android 2.0" orig="2.0">2.0</option>
     <option value="Android 3.0" orig="3.0">3.0</option>
     <optgroup label="IPhone"></optgroup>
     <option value=" IPhone 2.0" orig="2.0">2.0</option>
     <option value=" IPhone 3.0" orig="3.0">3.0</option>
     <option value=" IPhone 4.0" orig="4.0">4.0</option>
   </select>
</div>

JavaScript

$('[name="androidSelect"]').change(function(){
    var i = $(this)[0].selectedIndex ; 
    console.log(i);
    var x = $(this).val();
    $(this).children('option').each(function(){
        $(this).html($(this).attr('orig'));
    });
    $(this).children('option:eq('+i+')').html(x);
    console.log($(this).children(':eq('+i+')'));
});