javascript - Change underscore.js template variable on the go -

i want update value on template variable changes if user clicks it, change data on page.

<script type="text/template" id="graph-template"> <% _.each(results, function(results) { %>      <ul class="bargraph">         <li>             <div class="left"><p><%= results.title %></p></div>             <div class="right">              <!-- should change results.views if statement true without reloading data -->             <span class="bar" style="width: <%= math.floor(results.totalcount / 1000) %>%;">                 total views: <%= results.totalcount %>             </span>             <!-- should change results.views if statement true -->              </div>         </li>      </ul> <% }); %> </script>   $('input[name="views"]').change(function(e) {      if( $(this).val() == 'total') {         resultstemplating(sortbycount);     } else {         resultstemplating(sortbyaverage);     } }); 

in case add ids each item in results collection , update items them. , after changes template should updated new data , inserted again.

this example click, can change it

var results = [     { id: 1, title: 'some title', totalcount: 2},     { id: 2 ,title: 'another title', totalcount: 3},     { id: 3, title: 'another title', totalcount: 4} ];  var compiled = _.template($('#graph-template').html()); $('#app').html(compiled({results: results}));  $('body').on('click', '.js-value', function() {     var $el = $(this);     _.each(results, function(item) {         if (item.id == $el.data('index')) {             item.totalcount += +$el.attr('value');         }     });     results = _.sortby(results, 'totalcount');     $('#app').html(compiled({results: results})); }); 

and see fiddle http://jsfiddle.net/shurshilin/kxk1lhkf/1/

feel free ask if have questions because maybe understood question incorrectly.