JSFiddle - React, Tailwind, and code Playground

by dcodesmith

HTML

<div ng-app='app' class="filters_ct" ng-controller="selectFilter">
    <ul>
        <li ng-repeat="filter in filters" ng-click="select($index)" ng-class="{sel: $index == selected}">
            <span class="filters_ct_status"></span>
            {{filter.time}}
        </li>
    </ul>
</div>

CSS

.sel {
    color:red
}

JavaScript

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

app.controller('selectFilter', function($scope) {

    $scope.filters = [
            {
                'filterId': 1,
                'time': 'last 24 hours',
            },
            {
                'filterId': 2,
                'time': 'all',
            },
            {
                'filterId': 3,
                'time': 'last hour',
            },
            {
                'filterId': 4,
                'time': 'today',
            },
            {
                'filterId': 5,
                'time': 'yersteday',
            }
        ];
    $scope.selected = 0;

    $scope.select= function(index) {
       $scope.selected = index; 
    };
});