title: document.querySelector whats " * " doing?
body: <p>I saw a sample which looked like this:</p>
  
  <pre><code>document.querySelector('#webchat &gt; *').focus();
  </code></pre>
  
  <p>I know what it does (sets the focus into the sendbox of the webchat), but I dont understand what the " * " stands for. I know that #webchat is the "parent".</p>
  
  <p>I implement the whole webchat with an external javascript, so I didn't code anything of the DOM.
  The sendbox's id is "webchat-sendbox-input" so nothing with a " * ".</p>
  
  <p>Thats how the DOM looks like:
  <a href="https://i.stack.imgur.com/DqWsC.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DqWsC.png" alt="enter image description here"></a></p>