title: Apply style to an HTML element added dynamically by v-for using Vuejs
body: <p>I'm adding elements to a list dynamically using v-for.</p>
  
  <pre><code>&lt;ol&gt;
      &lt;li v-for="light in lights"&gt;
          &lt;input type="range" min="0" max="255" v-model="light.currentBrightness" v-on:change="setBrightness(light)" /&gt;
      &lt;/li&gt;
  &lt;/ol&gt;
  </code></pre>
  
  <p>I want to decorate the slider using <a href="http://rangeslider.js.org/" rel="nofollow noreferrer">rangeslider</a>.</p>
  
  <p>Problem is, when a new element is added after the DOM is initialized, it's not taking the style specified in rangeslider.js. Way to fix this is to call the reinitialize method in rangeslider.js which will redecorate all the slider elements. </p>
  
  <p>I'm not sure how to call the javascript method when the element is added dynamically during the runtime. Does anyone how to do it? To me, it seems like a very common problem but I could not find a solution by Googling.</p>
  
  <p>My issue is same as discussed in <a href="https://github.com/andreruffert/rangeslider.js/issues/208" rel="nofollow noreferrer">github</a>.</p>