JSFiddle - React, Tailwind, and code Playground

HTML

<form data-bind="with: user">
<select id="selectRoles" 
    data-bind="options: $root.allRoles, selectedOptions: Roles, optionsText: 'Name', optionsValue: 'Id'" 
    multiple="true" 
    size="5">
</select>
</form>

JavaScript

var User = function () {
    var self = this;

    self.Id = ko.observable(1337);
    self.Username = ko.observable('pietpaulusma');
    self.Roles = ko.observableArray([{ Id: 1, Name: 'Administrator' }]);
};

function UserViewModel() {
    var self = this;
    
    self.user = ko.observable(new User());
    self.allRoles = ko.observableArray([{ Id: 1, Name: 'Administrator' }, { Id: 2, Name: 'Moderator' }]);
}

ko.applyBindings(new UserViewModel());