Jquery each() function increment by half
<p>I'm trying to add <code>0.5</code> increment after each iteration using jquery <code>each()</code> function. I have to add <code>animatoin-delay</code> property on <code>li</code> which value should increase (<code>0.5</code>) that i can animate them on document load.</p>

<h2>HTML</h2>

<pre><code>&lt;ul class="social-link"&gt;
        &lt;li&gt;&lt;/li&gt;
        &lt;li&gt;&lt;/li&gt;
        &lt;li&gt;&lt;/li&gt;
        &lt;li&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<h2>JS</h2>

<pre><code>$('ul.social-link li').each(function(i){
        plus =  i - 0.5;
        $(this).addClass('animated fadeIn').css('animation-delay',plus+'s');
});
</code></pre>

<p>I have tried above code, but it does working after first iteration, on first iteration its given <code>0.5</code> but after that its adding (1.5, 2.5, 3.5) 1 instead of 0.5. I know my logic is not correct. Can any one guide me regarding this that its possible or not using <code>each()</code> function. I can do it using <code>css</code> but it will be good if done using jquery. I will appreciate if someone guide me. Thank You</p>