JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
<script src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js"></script>
<script src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.min.js"></script>
<!-- This is your page template -->
<script id="page" type="text/x-handlebars-template">
    {{datetime "d1" "Start Date"}}
    {{datetime "d1" "End Date"}}
    {{datetime "d1" "Cancel Date"}}
    {{datetime "d1" "Update Date"}} 
    {{datetime "d1" "Another One"}}
</script>

<!--This is your template for datetimepicker-->
<script id="datetime" type="text/x-handlebars-template">
    <label>{{label}}</label>
    <div id="{{id}}" class="input-append date">
      <input type="text"></input>
      <span class="add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
      </span>
    </div>  
</script>

JavaScript

Handlebars.registerHelper('datetime', function (id, label) {
    var dom = Handlebars.compile($("#datetime").html())({id: id, label: label});
    
    return new Handlebars.SafeString(dom);
});

//generate your page.
var template = Handlebars.compile($("#page").html())();
$("body").html(template);

//initialize your datetime pickers.
$('body .date').datetimepicker({
        format: 'dd/MM/yyyy hh:mm:ss',
        language: 'pt-BR'
      });