jquery - How to add the `active` class on click of `li` element -

i quite new angularjs. need know how handle scenario using it.

i have array values. using ng-repeat iterate array , works fine. requirement how add class(active) first child of ul , whenever user clicks, clicked element should active class , remove the active class rest of li elements.

i've done in jquery like:

$('li').addclass('active').siblings().removeclass('active') 

but how achieve same here?

my code :

javascript controller

var myapp = angular.module("myapp", []);  myapp.controller("main", function ($scope) {    $scope.items = [1,2,3,4,5];    $scope.activate = function (item) {      //how active item?      //onload how add class on first li?    }  }) 

html

 <ul>      <li ng-click="activate(item)" ng-repeat="item in items">         {{item}}     </li>    </ul> 

live demo

how this. store current active item in controller , apply class if one.

html

<ul>     <li          ng-click="activate(item)"          ng-repeat="item in items"         ng-class="{'active': item == active}">{{item}}     </li> </ul> 

js controller

$scope.items = [1,2,3,4,5]; $scope.active = items[0]; // onload first element active $scope.activate = function (item) {     $scope.active = item; } 

plunker