JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>
<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="text-div"></div>

JavaScript

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

pop.text({
    start: 1.38,
    end: 3.14,
    text: "Hello World",
    target: "text-div"
});

pop.subtitle({
    start: 2.71,
    end: 5.12,
    text: "Hello Again"
});

// play video
pop.play();