Untitled

<video id="video" src="my-video.mp4"></video>
<div id="controls">
    <button id="playButton">Play</button>
    <button id="pauseButton" hidden>Pause</button>
    <button id="airPlayButton" hidden disabled>AirPlay</button>
</div> 

<script>

var airPlayButton = document.getElementById("airPlayButton");
var video = document.getElementById("video");
airPlayButton.addEventListener('click', function(event) {
    video.webkitShowPlaybackTargetPicker();
});

if (window.WebKitPlaybackTargetAvailabilityEvent) {

    video.addEventListener('webkitplaybacktargetavailabilitychanged',
        function(event) {
            switch (event.availability) {
            case "available":
                airPlayButton.hidden = false;
                airPlayButton.disabled = false;
                break;
            case "not-available":
                airPlayButton.hidden = true;
                airPlayButton.disabled = true;
                break;
        } }); 

} 

</script>