Show image background after video background autoplay

Hi i have a simple question about a video background function.

I want to show a photo background after video background is played; i have tried by adding a background image in the css but at the end of the video, the image is now shown.

Here the code

<video id="my-video" class="video" autoplay>
<source src="media/demo.mp4" type="video/mp4">
<source src="media/demo.ogv" type="video/ogg">
<source src="media/demo.webm" type="video/webm">
</video><!-- /video -->

<script>
(function() {
/**
 * Video element
* @type {HTMLElement}
*/
var video = document.getElementById("my-video");

/**
 * Check if video can play, and play it
*/
video.addEventListener( "canplay", function() {
video.play();
 });
 })();
</script>

thanks