JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>
<script src="http://popcornjs.org/code/unsupported/lowerthird/popcorn.lowerthird.js"></script>
<video height="180" width="300" id="video" controls> 
<source src="http://files.dangerdean.com/m/1.mp3"></source>

</video>

JavaScript

// create our popcorn instance
var p = Popcorn( "#video" )
      // play the video
      .play()
      // set the volume to zero
      .volume( 0 )
      .lowerthird({
      	color: 'red',
        start: 1,
        end: 5,
        salutation: "Mr",
        name: "Hyde",
        role: "Monster"
      })