JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="MainCtrl">
        
        <ul class="restaurant-filter">
            <li> <i class="icon-search"></i>Organize results by "Price" &amp; "Rating"&hellip;
                <ul class="nav nav-pills">
                    <li ng-class="active('price')"> <a ng-click="order = 'price'">Price</a></li>
                    <li ng-class="active('rating')" ><a ng-class="active('rating')" ng-click="order = 'rating'">Rating</a></li>
                    <li ng-class="active('rating')" ><a ng-class="active('rating')" ng-click="order = 'restaurantName'">NAME</a></li>
                </ul>
            </li>
        </ul>

        <ul class="available-restaurants">
            <li ng-repeat="restaurant in availableRestaurants | orderBy:order:true" ng-click="addRestaurantToEvent(restaurant.restaurantName)">
                <h6>{{restaurant.restaurantName}}</h6>
                <p>Rating: {{restaurant.rating}}  Price: {{restaurant.price | currency}}</p>
                <p>{{restaurant.restaurantName}}</p>
    
                <i class="icon-chevron-right"></i>                    
            </li>
        </ul>
        
    </div>
</div>

JavaScript

/* http://stackoverflow.com/questions/13711960/angular-js-how-to-get-orderby-or-filter-from-an-unordered-list-to-work*/

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

app.controller('MainCtrl', function($scope) {
    
    $scope.order = 'price';
    
    $scope.active = function(x) {
        return x == $scope.order ? 'active' : '';
    }
        
    $scope.availableRestaurants = [
        {
        price: 12,
        rating: 1,
        restaurantName: 'Restaurant 1'},
    {
        price: 8,
        rating: 3,
        restaurantName: 'Restaurant 2'},
    {
        price: 23,
        rating: 2,
        restaurantName: 'Restaurant 3'}
    ];
});