<select id="color" name="color" class="form-control custom-select" value="{color}">
    <option class="white" value="default">Default</option>
    <option class="primary" value="primary">Blue</option>
    <option class="success" value="success">Green</option>
    <option class="info" value="info">Light Blue</option>
    <option class="warning" value="warning">Yellow</option>
    <option class="danger" value="danger">Red</option>
    <option class="white" value="none">None</option>
</select>
<script>
    document.getElementById('color').addEventListener('change', function() {
        var container = document.getElementById('color');
        var selectedClass = this.options[this.selectedIndex].className;
        console.log( 'change color to: ' + selectedClass );
        container.className = 'form-control custom-select ' + selectedClass;
    });
</script>