JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="modal-list" data-bind="'foreach': businessUnits.businessUnitsList">
    <li class="filterItem" data-bind="'text': title, 
        css: { 'filterItemSelect': siteID === $parent.businessUnits.currentSelected() }, 
        'click': $parent.businessUnits.selectItem">
    </li> 
</ul>
<div>
  <label data-bind="'text': $parent.businessUnits.currentSelected()"></label>
</div>

CSS

.filterItemSelect {
    color:#0069ab;
}

JavaScript

var businessUnitsModel = {
    businessUnitsList: ko.observableArray([
        { siteID: "a", title: "business1" },
        { siteID: "b", title: "business2" }, 
        { siteID: "c", title: "business3" }, 
        { siteID: "d", title: "business4" }]),
    currentSelected: ko.observable(),
    selectItem: function (site) {         
        businessUnitsModel.currentSelected(site.siteID); 
    }
}

//overall viewModel
var viewModel = {
    businessUnits: businessUnitsModel,
};

ko.applyBindings(viewModel);