javascript - How to listen for a "div created" event?

Question

I need to know when a div element is added to the page. Anytime, anywhere, as a child at any depth of the document tree.

const { body } = document;
const config = { childList: true, subtree: true };
const callback = function (mutationsList, observer) {
  for (const mutation of mutationsList) {
    if (mutation.type === 'childList') {
      console.log('A child node has been added or removed.');
      mutation.addedNodes.forEach((node) => console.log(node));
    }
  }
};
const observer = new MutationObserver(callback);
observer.observe(body, config);

I run this code via an extension immediately upon page navigation. As Google search results are loading, this doesn't log the creation of any of them. Only a handful of divs in the header and footer, and a couple scripts. I need to be notified as soon as any and every div element appears on the page.

question from:https://stackoverflow.com/questions/65911249/how-to-listen-for-a-div-created-event

Answer 1

observer.observe(body, config);

This was wrong, it has to be:

observer.observe(document, config);