title: Why is Vue breaking my own code dom modifications?
body: <p>So I've got a class of mine, it's quite big so I cannot include it here, but essentially:</p>
  
  <pre><code>var MyClass = function(options) {
    this.options = {}
    this.options = $.extend(true,this.options,options);
    this.init();
  }
  
  MyClass.prototype = {
    init:function(){
      this.set_events();
    },
  
    set_events:function(){
      // attach some dom events that in turn alter the dom (change some data- properties)
    }
  }
  </code></pre>
  
  <p>What is quite curious to me, is that IF I instantiate it after Vue, MyClass will work properly and it will be able to modify the dom as well will work.</p>
  
  <pre><code>var vueapp = new Vue({
    // init stuff
  });
  
  myclassinstance = new MyClass(); // OK
  </code></pre>
  
  <p>But, if I'll do the opposite:</p>
  
  <pre><code>myclassinstance = new MyClass(); // WILL NOT WORK (it won't be able to change data- properties upon dom events)
  
  var vueapp = new Vue({
    // init stuff
  });
  </code></pre>
  
  <p>Note #1: I've got no errors in console. </p>
  
  <p>Note #2: Dom events get executed: I'm able to log from them and inspect dom elements, but it seems I cannot change their props!</p>
  
  <p>So what? Anyone can explain me why this happens?</p>