title: Vue2 error 'classList' of null error
body: <p>So i am writhing a component in Vue. Just a simple navigation. Withing methods i made a active script. i also made a "created" loadfunction script and console the element of it. </p>
  
  <p>It gives me the following error in the console:</p>
  
  <pre><code>TypeError: Cannot read property 'classList' of null
  at VueComponent.created (eval at &lt;anonymous&gt; (app.js:1002), &lt;anonymous&gt;:23:67)
  at callHook (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:2275:21)
  at VueComponent.Vue._init (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:3758:5)
  at new VueComponent (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:3922:12)
  at createComponentInstanceForVnode (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:3117:10)
  at init (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:2925:45)
  at createComponent (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:4656:9)
  at createElm (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:4599:9)
  at createChildren (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:4724:9)
  at createElm (eval at &lt;anonymous&gt; (app.js:672), &lt;anonymous&gt;:4632:9)
  </code></pre>
  
  <p>Weirdly enough when i remove <code>.classList</code> it still gives a <code>null</code> value and not a empty array.</p>
  
  <p>Here is my code for the component (note this is in dutch):</p>
  
  <pre><code>&lt;script&gt;
  export default {
      name: 'frontnav',
      data () {
          return {
              aantal: [
                  'Aankomende Gasten',
                  'In Huis',
                  'Vertrekkende Gasten',
                  'Dag Gasten'],
              dag: [
                  'Vandaag',
                  'Morgen',
                  'Overmorgen',
                  'Deze Week',
                  'Volgende Week'],
              active: 'Aankomende Gasten'
          }
      },
      methods: {
          makeActive: function (aantal) {
              this.active = aantal;
              let el = document.querySelector('nav tr a:first-child');
              document.querySelector('.' + item).classList.add('active');
          },
          loadfunction: function () {
             const el = document.querySelector('nav a:first-child');
             el.classList.add('active');
          }
      },
      created () {
         this.loadfunction();
          console.log(document.querySelector('nav tr a:first-child').classList);
      }
  }
  </code></pre>
  
  <p></p>