JSFiddle - React, Tailwind, and code Playground

HTML

<select id="ddlMylist">
  <option value="10">Choice 1</option>
  <option value="20">Choice 2</option>
  <option value="30">Choice 3</option>
  <option value="40">Choice 4</option>
</select>

JavaScript

var ClearOnClick = function(){
  document.getElementById("ddlMylist").selectedIndex = -1;
  StopListening();
};

function StopListening(){
  console.log("not listening...");
  document.getElementById("ddlMylist").removeEventListener("mousedown", ClearOnClick);
  document.getElementById("ddlMylist").addEventListener("change", StartListening);
}

function StartListening(){
  console.log("listening...");
  document.getElementById("ddlMylist").addEventListener("mousedown", ClearOnClick);
}
StartListening();