Как безболезненно очистить контейнер с панорамами?

Question

[zlodiak]

Есть карта. После каждого клика по ней создаётся плеер панорамы, но не показывается, а складывается в отдельный контейнер (так надо, не спрашивайте зачем).

Я хотел бы после нажатия на кнопочку очищать этот контейнер с плеерами панорамы. Для этого я средствами js нахожу в DOM элемент, который содержит плееры панорам и очищаю его содержимое.

Оно очищается, но после этого в консоль валится ошибка:

Uncaught TypeError: Cannot read property 'offsetWidth' of null

Помогите пожалуйста корректно очищать этот контейнер.

JSFIDDLE

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

[0xD34F]

Складываем панорамы в массив, а когда надо удалить - дёргаем метод destroy для каждого элемента, как-то так.