<div class="row">

  <div class="col-md-12">

​

    <select id="select" class="mdb-select colorful-select dropdown-primary md-form" multiple searchable="Search here..">

      <option value="" disabled selected>Choose your country</option>

      <option value="1">USA</option>

      <option value="2">Germany</option>

      <option value="3">France</option>

      <option value="4">Poland</option>

      <option value="5">Japan</option>

    </select>

    <label class="mdb-main-label">Label example</label>

    <button class="btn-save btn btn-primary btn-sm">Save</button>

​

  </div>

</div>

​

<button id="clear-btn" class="btn btn-primary">Clear</button>

​

// Material Select Initialization

$(document).ready(function() {

  $('#select').materialSelect();

  $('#clear-btn').on('click', () => {

    $('#select').materialSelect({destroy: true});

    $('#select').val('');

    setTimeout(() => {

      $('#select').materialSelect();

    })

  });

});