JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp">
    <ul ng-controller="myCtrl">
        <li ng-repeat="item in items" class="commonClass" ng-class="{'on': selectedItem === item}" ng-click="selectItem( item )">
            {{ item.name }}
        </li>
    </ul>
</div>

CSS

.on {
    color:red
}

JavaScript

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {
    $scope.selectedItem = null;
	$scope.items = 
    [
        {name: "Apple"},
        {name: "Banana"},
        {name: "California"}
    ];
    
    $scope.selectItem = function(item) {
        $scope.selectedItem = item;
    };
})