title: Vue.js 2 dynamically adding and removing classes in looped elements
body: <p>I have a project here where I need to add and remove layers of images, using vue.js 2. I am building up a pizza where I need to add toppings. My current solution has a flaw - it removes all other elements/ pizza toppings when I add a new one.</p>
  
  <p>The toppings are generated from an array which I loop through.</p>
  
  <p>Can you please help, I am sure this is easy but me being a rookie in vue.js I have already struggled for hours... Thanks!</p>
  
  <pre><code>&lt;div id="app" class="container-fluid"&gt;
        &lt;div class="row"&gt;
            &lt;div class="left-container"&gt;
                &lt;h2&gt;add your ingredients:&lt;/h2&gt;
                &lt;div v-for="(item, index) in pizzas"  v-bind:key="index"&gt;
                  &lt;button class="btn btn-primary" v-on:click="show == index ? show = -1 : show = index"&gt;{{ item.pizza }}&lt;/button&gt;
                &lt;/div&gt;
                &lt;div class="submit-buttons"&gt;
                    &lt;button class="btn btn-primary reset-pizza" v-on:click="show = -1"&gt;Reset pizza&lt;/button&gt;
                    &lt;a href="http://fb.com" target="_blank"&gt;&lt;button class="btn btn-primary submit-pizza"&gt;Share pizza&lt;/button&gt;&lt;/a&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="right-container"&gt;
                &lt;ul class="pizza-layers"&gt;
                  &lt;li v-for="(item, index) in pizzas" class="pizza-canvas" v-bind:class="item.class" v-if="show == index"&gt;&lt;/li&gt;
                  &lt;li class="pizza-canvas pizza-canvas--topping-base"&gt;&lt;/li&gt;
                &lt;/ul&gt;
            &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;script&gt;
   new Vue({
      el: '#app',
      data: {
        pizzas: [
          { pizza: 'Salami', class: 'pizza-canvas--topping-salami' },        
          { pizza: 'Rucolla', class: 'pizza-canvas--topping-rucolla' },
          { pizza: 'Cheese', class: 'pizza-canvas--topping-cheese' }
        ],
        show: {},
      },
    })
  &lt;/script&gt;
  </code></pre>