Wait For An Element To Be Added To The Document – wait-for-it.js

Preview:

Description:

wait-for-it.js is a zero-dependency JavaScript library that triggers a function when an element has been added to the DOM. Based on the MutationObserver API.

See Also:

• Execute Codes Until An Element’s Transition Has Ended – waitForElementTransition

How to use it:

1. Download and include the wait-for-it.js library on the page.

<script src="wait-for-it.js"></script>

2. Invoke a callback function when an element is added to the document.

<button class="btn" id="example">Example Button</button>

waitForElement('#example', function () {
  console.log('The Example Button Has Been Added To The Document!');
});

3. Return an error if the target element has not been added to the page within a specified time.

waitForElement('#example', function (timeout) {
  if(timeout === true) {
    console.log('As Expected, Element with #example did not appear in 2000 milliseconds.');
    return;
  }
  console.log('The Example Button Has Been Added To The Document!');
}, 2000);