JSFiddle - React, Tailwind, and code Playground

HTML

<select id="selectOption0">
 <option value="1">One0</option>
 <option value="2">two</option>
</select>


<select id="selectOption">
     <option value="1">One</option>
     <option value="2">two</option>
    </select>

<select id="selectOption2">
 <option value="1">One2</option>
 <option value="2">two</option>
</select>

JavaScript

$(function(){
    
  $('#selectOption').focus(function(e){
      e.preventDefault();
      //alert('clicked');
      console.log('_focused'+e.type);
  });

  $('#selectOption').click(function(e){
      e.preventDefault();
      //alert('clicked');
      console.log('_clicked'+e.type);
  });

      $('#selectOption').change(function(e){
     e.preventDefault();
      console.log('_changed'+e.type);
  });
    
  /*$('#selectOption').on('select', function(e){
      //e.preventDefault();
      //alert('clicked');
      console.log('_selected'+e.type);
  });*/

    
$('#selectOption').on('focus', 'select', function(){ console.log('_combined'+e.type); });
});