Create a div around a iframe playing a youtube video without interrupting the video

See more:

Javascript

I'm having a hard time on how to create a div around a iframe without interrupting the iframe playing the YouTube video I know the code is wrong for this situation but i'm just clueless how I can do this.

This is my code

<style>
    button{
     margin-top: 25px;
      display: block;
    }
    </style>
    
    <script>
    document.addEventListener('DOMContentLoaded',function(){
    
    document.querySelector('button').addEventListener('click',addADivAroundAIframe);
    
    function addADivAroundAIframe() { 

            var iframe= document.querySelector('iframe');
            var parent = iframe.parentNode;
            var div= document.createElement('div');

            parent.replaceChild(div,iframe);

            div.appendChild(iframe);
      
      }
    
    });
    </script>
    
    <iframe src='https://www.youtube.com/embed/m1jY2VLCRmY'></iframe>
    
    <button>Generate</button>

What I have tried:

Google, other help sites, books