title: Make VueJS and jQuery play nice
body: <p>This question is related/similar to <a href="https://stackoverflow.com/q/42792983/2012740">Using intl-tel-input and vuejs2 together</a> , which is still unanswered.</p>
  
  <p>And <a href="https://stackoverflow.com/q/43236848/2012740">VueJS Use prop as data-attribute value</a> which has a solution, but explains a bit the "environment".</p>
  
  <p>So, long story short, I am dynamically setting up a new bootstrap tab (Title and URL), and then trying to (re)bind some functionality using <code>jQuery</code>.</p>
  
  <p>Adding the following line <a href="https://github.com/thecodeassassin/bootstrap-remote-data/blob/master/js/bootstrap-remote-tabs.js#L258" rel="noreferrer">https://github.com/thecodeassassin/bootstrap-remote-data/blob/master/js/bootstrap-remote-tabs.js#L258</a> in my Vue method will apply the functionality, but only if I trigger the change twice. </p>
  
  <p>The same issue with the first (unanswered) question.</p>
  
  <p>Could someone explain a bit how the things work between <code>vueJS</code> and <code>jQuery</code> ? And how to solve things, hopefully without needing to rewrite jQuery packages. </p>
  
  <p>If I <code>console.log</code> my variables just seem one step behind.</p>
  
  <p>LE: </p>
  
  <p>I have prepared a Pen for the related mentioned issue:
  <a href="https://codepen.io/AngelinCalu/pen/LWvwNq" rel="noreferrer">https://codepen.io/AngelinCalu/pen/LWvwNq</a></p>