vue js v-for loop display item only once
<p>I wish to display an arrow in between my looped v-for divs, but not on the last one. How can I achieve this in Vue JS? Ideally I'd the loop to break and not control this element at all, but may have to go with a css last of type solution.</p>

<pre><code>&lt;div class="row"&gt;
    &lt;div v-for="events in list.events" &gt;
        &lt;div class="medium-4 columns" &gt;
            &lt;div class="card"&gt;
                &lt;img src="http://placehold.it/400x200"&gt;&lt;/br&gt;
                @{{events.title}}
                @{{events.start}} - @{{events.end}}
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="medium-1 columns arrow" &gt;
            &lt;i class="fa fa-arrow-circle-right" aria-hidden="true"&gt;&lt;/i&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>