JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<title>iE8 focus gammyness</title>

</head>
<body>
  <select id="mySelect">
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>
    <p> In iE8, adding a class that sets the background color on focus stops the dropdown - that is to say; you have to click twice on an unfocussed select for it to drop down.</p>
  <select id="reference">
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>
        
</body>
</html>

CSS

.isfocus{ 
    background-color: red;
}

JavaScript

$(function(){
  $("#mySelect")
    .focus( function(){ $(this).addClass("isfocus"); } )
    .blur( function(){ $(this).removeClass("isfocus"); } );
});