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/trailer.mp4"></source>
<source src="http://videos.mozilla.org/serv/webmademovies/trailer.webm"></source>
</video>
<br />
<input id="pbrButtonPlus" type="button" value="playbackrate + 0.1"/><br />
<input id="pbrButtonMinus" type="button" value="playbackrate - 0.1"/>

JavaScript

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

// Listen for ratechange event
v.addEventListener( "ratechange", function( e ) {

  console.log( "ratechange fired!" );

}, false );

// play the video.
v.play();

var pbrBtnPlus = document.getElementById( "pbrButtonPlus" ),
    pbrBtnMinus = document.getElementById( "pbrButtonMinus" );

pbrBtnPlus.addEventListener( "click", function() {
  v.playbackRate =  v.playbackRate + 0.1;
}, false );

pbrBtnMinus.addEventListener( "click", function() {
  v.playbackRate =  v.playbackRate - 0.1;
}, false );