Selectize JS Clear

Selectize JS Clear

by adiioo7

HTML

<script src="https://selectize.github.io/selectize.js/js/selectize.js"></script>
<link rel="stylesheet" href="https://selectize.github.io/selectize.js/css/selectize.default.css">
<div id="wrapper">
    <div class="demo">
        <div class="control-group" dir="rtl">
            <label for="input-tags">Tags:</label>
            <input type="text" id="input-tags" class="demo-default" value="awesome,neat">
        </div>
        <script>
            
        </script>
    </div>
    <input type="button" class="button" id="btnClear" value="Clear"></input>
</div>

CSS

.selectize-control::before {
		    -moz-transition: opacity 0.2s;
		    -webkit-transition: opacity 0.2s;
		    transition: opacity 0.2s;
		    content:' ';
		    z-index: 2;
		    position: absolute;
		    display: block;
		    top: 12px;
		    right: 34px;
		    width: 16px;
		    height: 16px;
		    background: url(images/spinner.gif);
		    background-size: 16px 16px;
		    opacity: 0;
		}
		.selectize-control.loading::before {
		    opacity: 0.4;
		}

JavaScript

jQuery(function ($) {
    var $select = $('#input-tags').selectize({
        persist: false,
        create: true
    });

    $("#btnClear").on("click", function () {
        var selectize = $select[0].selectize;
        selectize.clear();

    });
});