How to add html using templating engine?

Question

JavaScript

I am using the underscore template engine.

$(document).on("click", ".load-more a", function(){
    var id = $('.products').children('li:last').data('id');
    inputs = $(".filter form").serializeArray();
    var template = $("#products").html();

    $.ajax({
      type: "post",
      url: "/loadmore",
      data: { "id":id, "inputs":inputs },
      beforeSend: function() {
            $(".loader").css('display', 'block');
        },
      success: function(result) {
              setTimeout(function(){
                $(".loader").css('display', 'none');
              }, 500);
              $(".products").append(_.template(template,{ result:result, manufacturers:manufacturers, country:country }));
          },
    });
  });

you do not need to redraw the view, you need to add blocks to the existing ones, since this button is responsible for reloading products. Can this be done with Underscore? And if not, how about using regular jquery?

Answer 1

Use this micro-templater and the jQuery append function to load content:
ejohn.org/blog/javascript-micro-templating