title: document.querySelector is not a function - trying to replace # and links with social wrappers
body: <p>I have some plain text inside of a <code>&lt;p&gt;</code> tag that I am trying to automatically find all links and all hashtags. I broken my script in two parts:</p>
  
  <ol>
  <li>First apply the hashtag wrapper</li>
  <li>Then apply the link wrapper</li>
  <li>Execute function will run both functions above</li>
  </ol>
  
  <p>I want to use pure JavaScript. What is the JS Equiv of getting HTML and replacing?</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;p&gt;
  Thank you to @InstagramUsername for the award. I’m glad to contribute to the success of the property sector through the efforts of @AnotherUser.
  #HashtagAwards #Another
  &lt;/p&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>function getHashTags(){
   // Find # and wrap in &lt;a&gt;
      let hashTxt = document.querySelector("p")[0].html();
      hashTxt = hashTxt.replace(/#(\w+)/g, "&lt;a href='https://instagram.com/explore/tags?q=$1'&gt;$1&lt;/a&gt;");
      hashTxt.html(hashTxt);
  }
  
  function getLinks(){
   // Find @ and wrap in &lt;a&gt;
      let linkStr = document.querySelector("p")[0].html();
      linkStr = linkStr.replace(/@(\w+)/g, "&lt;a href='https://instagram.com/$1/'&gt;@$1&lt;/a&gt;");
      linkStr.html(linkStr);
  }
  
  function execute(){
      getHashTags()
      getLinks()
  }
  
  execute()
  </code></pre>