Highlight HTML5 from video to canvas

I tried to capture a frame from a video and draw it in a canvas using HTML5, but the code below does not work. when I click the start button, the canvas is filled with black

    <video src="video2.mp4" autoplay="true" type="video/mp4" width="300" height="200" id="vid">
        </video>
        <canvas id="cvs"> </canvas>
        <button onclick="start()">Start</button>
        <script>
        var video=document.getElementById("vid");
        var cvs=document.getElementById("cvs");
        function start(){
        cvs.getContext("2d").drawImage(video, 0, 0, 300,200);
        }
</script>