const targetNode = document.getElementById('observable');
const config = {
  childList: true,    // Watch for child element changes
  attributes: true,   // Watch for attribute changes
  subtree: true,      // Watch all descendants
  characterData: true // Watch text content changes
};

const observer = new MutationObserver((mutations) => {
  mutations.forEach(mutation => {
    if (mutation.type === 'childList') {
      console.log('Nodes added:', mutation.addedNodes);
      console.log('Nodes removed:', mutation.removedNodes);
    }
    if (mutation.type === 'attributes') {
      console.log(`Attribute "${mutation.attributeName}" changed`);
    }
  });
});

observer.observe(targetNode, config);

// Stop observing
observer.disconnect();