JQ 点击按钮全屏播放视频

如何使用jq 点击全屏播放视频，不是那种html 弹窗放大播放视频，是使用video组件自带的放大功能，可以在手机端使用
代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>全屏播放视频</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>

    <video id="video" width="640" height="360" controls>
        <source src="your-video.mp4" type="video/mp4">
        您的浏览器不支持 video 标签。
    </video>

    <button id="fullscreen-btn">全屏播放</button>

    <script>
        $(document).ready(function(){
            $('#fullscreen-btn').on('click', function(){
                var video = $('#video')[0]; // 获取 video 元素

                if (video.requestFullscreen) {
                    video.requestFullscreen();
                } else if (video.mozRequestFullScreen) { // Firefox
                    video.mozRequestFullScreen();
                } else if (video.webkitRequestFullscreen) { // Chrome, Safari 和 Opera
                    video.webkitRequestFullscreen();
                } else if (video.msRequestFullscreen) { // IE/Edge
                    video.msRequestFullscreen();
                }

                // 播放视频
                video.play();
            });
        });
    </script>

</body>
</html>