JSFiddle - React, Tailwind, and code Playground

by vol7ron

HTML

<button id="clearSelectButton">Clear</button>
<br />
<select id="select" multiple="multiple" size="10">
    <option value="default">default</option>
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
</select>

JavaScript

var $select = $('#select');
var $clearButton = $('#clearSelectButton');
$clearButton.on('click', function(event){
    $('option',$select).attr('selected',false);
});

$('#select').on('click', function(event){
    $clearButton.click();         // call an event, which clears this select list
    
    // still want to select an option 
    // from the select list (continuing original event)
});