Angular: NG-Class
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<ul class="navigation" ng:controller="NavigationController">
<li>Active: {{states.activeItem}}, Change here: <input ng-model="states.activeItem" /></li>
<li ng-repeat="item in items"
class="item"
ng-class="{'color': red}" ng-click="states.activeItem=item.id">{{item.title}}</li>
</ul>
CSS
ul.navigation li.active {
background-color: red;
}
JavaScript
var app = angular.module('app', []);
app.controller('NavigationController', function($scope){
// Have to use a wrapper object, otherwise "activeItem" won't work! Just try it!
$scope.states = {};
$scope.states.activeItem = 'item1';
$scope.items = [{
id: 'item1', title: 'Item 1'
}, {
id: 'item2', title: 'Item 2'
}, {
id: 'item3', title: 'Item 3'
}];
});