Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.js"></script>
<div ng-controller="MyCtrl">
<ul class="procedures">
<li ng-repeat="procedure in procedures">
<h4><a href="#" ng-click="show = !show" ng-bind-html="procedure.icon"></a></h4>
<div class="procedure-details" ng-show="show">
<p>text here: {{procedure.text}}</p>
<p>your number is: {{procedure.number}}</p>
<p>price you will pay: {{procedure.price}}</p>
</div>
</li>
</ul>
</div>
JavaScript
angular
.module('myApp',[])
.controller('MyCtrl', function($scope, $sce) {
$scope.procedures = [
{
icon: $sce.trustAsHtml('<i class="fa fa-american-sign-language-interpreting" aria-hidden="true">icon</i>'),
text: 'test text',
number: 1,
price: 10000
}
];
});