How to avoid VueJS to remove the props attributes in the DOM?
<p>I have a <code>prop</code> on a component that is correctly passed to the component. The value is correctly set inside the component. But the attribute is removed at the compilation time of VueJS. (I guess)</p>

<p>How can I avoid the attribute to be removed ? At runtime I need to be able to get every element with same attribute like: <code>$("[group-name=' + vm.groupName + ']");</code></p>

<p>Here is a <a href="http://jsfiddle.net/Elfayer/8xwm9LmL/" rel="nofollow"><strong>DEMO</strong></a></p>

<h2>HTML</h2>

<pre><code>&lt;script type="x-template" id="my-component-tpl"&gt;
  &lt;div&gt;My Component's group name is &lt;b&gt;{{groupName}}&lt;/b&gt;.&lt;/div&gt;
  &lt;div&gt;But the attribute 'group-name' is no longer in the DOM...&lt;/div&gt;
&lt;/script&gt;

&lt;div id="app"&gt;
  &lt;my-component group-name="Demo"&gt;&lt;/my-component&gt;
&lt;/div&gt;
</code></pre>

<h2>JS</h2>

<pre><code>var myComponent = {
  template: '#my-component-tpl',
  props: ['groupName']
};

new Vue({
  el: '#app',
  components: {
    'my-component': myComponent
  }
});
</code></pre>