JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>
<video id="video" height="180" width="300" id="video" controls> 
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.mp4"></source>
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv"></source>
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.webm"></source>
</video>
<div id="mustache-div"></div>

JavaScript

// create popcorn instance
var pop = Popcorn( "#video" );

pop.mustache({
          start: 1,  // seconds
          end:  5,  // seconds
          target: 'mustache-div',
          template: '<h1>{{header}}</h1>'                           +
                    '{{#items}}'                                    +
                    '  {{#first}}'                                  +
                    '    <li><strong>{{name}}</strong></li>'        +
                    '  {{/first}}'                                  +
                    '  {{#link}}'                                   +
                    '    <li><a href="{{url}}">{{name}}</a></li>'   +
                    '  {{/link}}'                                   +
                    '{{/items}}'                                    +
                    ''                                              +
                    '{{#empty}}'                                    +
                    '  <p>The list is empty.</p>'                   +
                    '{{/empty}}'                                    ,

          data:     '{'                                                        +
                    '  "header": "Test 1", '                                   +
                    '  "items": [ '                                            +
                    '      {"name": "red", "first": true, "url": "#Red"}, '    +
                    '      {"name": "green", "link": true, "url": "#Green"}, ' +
                    '      {"name": "blue", "link": true, "url": "#Blue"} '    +
                    '  ],'                                                     +
                    '  "empty": false'                                         +
                    '}',
          static: true /* The json is not going to change, load it early. */
        } );

//play
pop.play();