Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
<ul>
<li ng-repeat="el in elements">
<h4><a href="#" ng-click="toggle()">{{el.name}}</a></h4>
<div class="details" ng-show="show">
<p>Amount: {{el.amount}}</p>
<p>Size: {{el.size}}</p>
</div>
</li>
</ul>
</div>
JavaScript
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.show = false;
$scope.elements = [
{
name: 'Name 1',
amount: 1,
size: 1,
},
{
name: 'Name 22',
amount: 22,
size: 22,
},
{
name: 'Name 333',
amount: 333,
size: 333,
}
];
$scope.toggle = function() {
$scope.show = !$scope.show;
}
}