Adding a td for existing table using jQuery
<p>I am trying to add a <code>td</code> for existing table using <code>jQuery</code>. But it's adding duplicate. How to validate exactly to add the <code>td</code>.</p>

<p>I have tried below code:</p>

<pre><code>&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
    &lt;th&gt;head1&lt;/th&gt;
    &lt;th&gt;head2&lt;/th&gt;
    &lt;th&gt;head3&lt;/th&gt;
    &lt;th&gt;head4&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
    &lt;tbody&gt;
        &lt;tr &gt;
            &lt;td class="test test2"&gt;a1&lt;/td&gt;
            &lt;td&gt;a2&lt;/td&gt;
            &lt;td&gt;a3&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="test"&gt;c1&lt;/td&gt;
            &lt;td&gt;c2&lt;/td&gt;
            &lt;td&gt;c3&lt;/td&gt;
        &lt;/tr&gt;            
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p><strong>jQuery code</strong></p>

<pre><code>    &lt;script&gt;
       $(document).ready(function() {

       for(i=0;i&lt;2;i++){
         var row = '&lt;td style="background: red"&gt;b_'+ i +'&lt;/td&gt;';    
                $('[class="test"]').before(row);
       }

})
        &lt;/script&gt;
</code></pre>

<p>I want to add a <code>td</code> where exactly match the <code>class="test"</code> is, but it's adding both <code>class="test test2"</code> and <code>class="test"</code>.</p>

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