title: How to wait for elements to be loaded in DOM in JavaScript?
body: <p>I have a problem with getting selector of an element in DOM, I placed the script source at the bottom of the HTML page and I also tried to wrap all codes in a function with <em>&quot;DOMContentLoaded&quot;</em> event, and it is still not working. in addition it disables jQuery that I am using it in my project.</p>
  <p>This is how I get the selector:</p>
  <pre><code>const char = document.querySelectorAll('.text');
  const num = document.querySelectorAll('span');
  </code></pre>
  <p>When I try to catch the selector in a function it works because it waits for the DOM to be loaded.
  I want to use these two variables in my code many times so I want them to be globally available and avoid repeating same line in many places.</p>
  <p>Is there any way to wait for the DOM to be loaded and then get the elements selector globally?</p>