vorrei far scomparire un video fullscreen con l'effetto fade out appena il video termina, ma non ci riesco in nessun modo ho provato così, qualcuno sa dirmi dove ho sbagliato o consigliarmi un'alternativa?



codice HTML:
<!DOCTYPE html><html><head><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script><script>$('#fullscreen-bg video').bind('ended', function(){
   $(this).parent().fadeOut()
})</script></head><body>
<div class="fullscreen-bg">        <video  autoplay  class="fullscreen-bg__video">            <source src="video/gatto.mp4" type="video/mp4">            <source src="video/gatto.ogv" type="video/ogg">            <source src="video/gatto.webm" type="video/webm">        </video>    </div></body></html>