There are multi libraries that each of them generates some HTML elements which runs separately such that by running one library first the elements created by the previous library must be removed then new elements will generated. It's worked fine, the elements removed correctly and new ones created correctly.

But there is a problem : the previous library that runs, again exist in the memory and listen to events. How can I dispose that from memory ?

import { LeftSidebarEditor } from './editor/LeftSidebar.Editor.js';
import { LeftSidebarSupport } from './support/LeftSidebar.Support.js';

function LeftSidebar(editor) {

    var signals = editor.signals;

    var container = new UIPanel();
    container.setId('left-sidebar-menu');

    var item = new LeftSidebarEditor(editor);

    container.add(item);

    signals.scopeChanged.add(function (scope) {

        editor.currentScope = JSON.stringify(scope);
        // remove all elements
        container.clear();

        item = null;

        switch (scope) {

             case 'editor':
                // container.add(new LeftSidebarEditor(editor));
                item = new LeftSidebarEditor(editor);

                container.add(item);
                break;

            case 'support':
                // container.add(new LeftSidebarSupport(editor));
                item = new LeftSidebarSupport(editor);

                container.add(item);
                break;

        }

    });

    return container;

}

LeftSidebarSupport

class LeftSidebarSupport {

    constructor(editor) {

        let counter = 0;
        setInterval(() => {
            console.log('I am alive from support', counter++);
        }, 2000);

         signals.objectSelected.add(function (object) {

        if (object != null) {

            return;
        }

        const selected = document.querySelector('#left-sidebar-menu li.selected');
        if (selected){
            let selected_attr =  selected.getAttribute('data-tooltip');
            if (selected_attr!='Tag'){
                removeAllSelected();
            }
        }

    });


        function removeAllSelected() {

        const selected = document.querySelector('#left-sidebar-menu li.selected');

        if (selected) {

            selected.classList.remove('selected');

        }

    }

    }
}

By change the signal from support to editor again the logs printed which must be stopped !! I want by switching between scopes just exist current scope library in memory and others removed entirely.

I am alive from support 89
I am alive from support 90
I am alive from support 91
I am alive from support 92
I am alive from support 93

Pleas, note !

There really is no interval, but exist a piece of code that removes a class from the elements. For simplicity, the interval example is used here. The basis of my question is why can LeftSidebarSupport running again?