How to painlessly clean the container with panoramas?

Question

JavaScript

There is a map. After each click on it, a panorama player is created, but it is not shown, but folded into a separate container (it's necessary, don't ask why).
I would like to clear this container with panorama players after pressing the button. To do this, I use js to find an element in the DOM that contains panorama players and clear its contents.
It is cleared, but after that an error is thrown into the console:
Uncaught TypeError: Cannot read property 'offsetWidth' of null
Please help me clear this container correctly.
JSFIDDLE
js:

ymaps.ready(init);

var myMap,
    currCoords = [55.76, 37.64];

function init(){     
    myMap = new ymaps.Map("map", {
        center: currCoords,
        zoom: 18
    });
    
    myMap.events.add('click', (e) => {
    	console.log(e.get('coords'));
      generatePanorama(e.get('coords'));
    });
    
    
    function generatePanorama(coords) {
      ymaps.panorama.locate(coords).done(
        (panoramas) => {
          if (panoramas && panoramas.length > 0) {
            const panoramaPlayer = new ymaps.panorama.Player('panorama', panoramas[0]);
          }
      });    
    }
    
    const clearbtn = new ymaps.control.Button({
      data: { content: '360°' },
      options: {
        layout: ymaps.templateLayoutFactory.createClass(
          "<div id='clear'>clear container</div>"
        )
      }
    });
    myMap.controls.add(clearbtn, { float: 'none' });

    setTimeout(() => {
        document.getElementById('clear').addEventListener('click', () => {
          console.log('clear cont');
          const panoramaDiv = document.getElementById('panorama');
          console.log(panoramaDiv);
          if (panoramaDiv) {
          	console.log('exist');
            panoramaDiv.innerHTML = '';
          }
        });
    }, 1000);
     
};

Answer 1

We put the panoramas into an array, and when we need to delete them, we pull the destroy method for each element, something like this .