title: Template.QuerySelector inside Template Tag Not Working
body: <p>I am trying to render a jsonTree instead of just json text and have the following javascript code to do it (Note: It is in a switch statement):</p>
  <pre><code>                case 'LONGTEXT':
                  this.isLongText = true;
                  var wrapper = this.template.querySelector('[data-id=&quot;tree_destination&quot;]');
                  var treedata = JSON.parse(this.value);
                  var tree = jsonTree.create(treedata, wrapper);
                  
                  break;
  </code></pre>
  <p>Here is the HTML:</p>
  <pre><code>     &lt;template if:true={isLongText}&gt;
              &lt;div data-id=&quot;tree_destination&quot;&gt;This is my tree.&lt;/div&gt;
          &lt;/template&gt;
  </code></pre>
  <p>I am quite new to all of this, so sorry if there is a trivial mistake. The library I am trying to use to get the tree can be found at this link: <a href="https://github.com/summerstyle/jsonTreeViewer" rel="nofollow noreferrer">https://github.com/summerstyle/jsonTreeViewer</a>
  or <a href="https://www.npmjs.com/package/json-tree-viewer" rel="nofollow noreferrer">https://www.npmjs.com/package/json-tree-viewer</a></p>
  <p>The error I am getting is &quot;Unhandled Rejection (TypeError): Cannot read property 'appendChild' of null&quot; and I am getting it on the <code>jsonTree.create()</code> line. I am almost 100% sure that it has to do with the wrapper, but I am not completely sure. When I do console.log of the wrapper, though, it returns null.</p>
  <p>Thanks for the help in advance!</p>