Add a class to list at variable position
<p>I have a variable set that represents an item in the list.</p>

<p>I also have the list:</p>

<pre><code>&lt;ul&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 1&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 2&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 3&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 4&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 5&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 6&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>What I need to do is to add a css class to the list thats in the position of the variable value.</p>

<p>For example:</p>

<pre><code>If myVariable = '1' then list will look like this:

&lt;ul&gt;
    &lt;li class="mylist"&gt;&lt;a href="#" class="myclass"&gt;Item 1&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 2&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 3&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 4&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 5&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 6&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

If myVariable = '3' then list will look like this:

&lt;ul&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 1&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 2&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#" class="myclass"&gt;Item 3&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 4&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 5&lt;/a&gt;&lt;/li&gt;
    &lt;li class="mylist"&gt;&lt;a href="#"&gt;Item 6&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>and so on.</p>

<p>How can I do this?</p>
