JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://popcornjs.org/code/popcorn.js"></script>
<script src="http://popcornjs.org/code/modules/player/popcorn.player.js"></script>
<script src="http://popcornjs.org/code/players/youtube/popcorn.youtube.js"></script>
<script src="http://popcornjs.org/code/plugins/footnote/popcorn.footnote.js"></script>
<div id="youtube" style="width:600px;height:400px;"></div>
<div id="foo"></div>
JavaScript
// create our popcorn instance
var pop = Popcorn.smart( "#youtube", "http://www.youtube.com/watch?v=v-7kf7OZQtw" );
pop.footnote({
start: 1,
end: 15,
text: "Youtube working!",
target: "foo"
});
// play video
pop.play();