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>

JavaScript

var v = document.getElementById( "video" );;

// Listen for volumechange event
v.addEventListener( "volumechange", function( e ) {
    console.log( "volumechange fired! ", v.volume );
}, false );

// Load the first video source
v.play();

setTimeout(function() {
  v.volume = 0.5;
}, 2500 );