Jquery colone child count issue (nth-child)
<p>I have a div called 'div.cloneFrame', and i am cloning that using jquery.clone. it works fine and i clone all i need, using this function :</p>

<pre><code>var needToClone = 4;
    var totalImgs = 0;
    for(i=0;i&lt;needToClone;i++){
        $('div.cloneFrame').clone()
        .removeClass('cloneFrame')
        .appendTo('.frame-group').each(function(){
            var imgSrcLength = $(this).find('img');
            for(j=0;j&lt;imgSrcLength.length;j++){
                totalImgs++;
                $(imgSrcLength[j]).attr('src','imgs/outfits/'+totalImgs+'.jpg');
            }
        })
    }
    $('div.cloneFrame').remove();
</code></pre>

<p>later i need to select the cloned div, for that i am using the nth child function</p>

<pre><code>$('div.myframe:nth-child('+1+')').addClass('incoming').next().addClass('outgoing');
</code></pre>

<p>But not work. in case if i use this :</p>

<pre><code>$('div.myframe:nth-child('+3+')').addClass('incoming').next().addClass('outgoing');
</code></pre>

<p>it's working well. why it need skiping 2 numbers on nth-child? anything wrong from my side?</p>

<p>my HTML :</p>

<pre><code>&lt;div class="frame-group"&gt;

            &lt;div class="cloneFrame myframe"&gt;
                &lt;div id="orange-frame" class="product-frame"&gt;
                    &lt;a class="purchase-btn" href="#"&gt;Purchase this item&lt;/a&gt;
                    &lt;img alt="women coat" src="imgs/yellow-coat.jpg"&gt;
                &lt;/div&gt;
                &lt;div id="yellow-frame" class="product-frame"&gt;
                    &lt;a class="purchase-btn" href="#"&gt;Purchase this item&lt;/a&gt;
                    &lt;img alt="blue coat" src="imgs/coat-blue.jpg"&gt;
                &lt;/div&gt;
                &lt;div id="brown-frame" class="product-frame"&gt;
                    &lt;a class="purchase-btn" href="#"&gt;Purchase this item&lt;/a&gt;
                    &lt;img alt="women shoe" src="imgs/women-shoe.jpg"&gt;
                &lt;/div&gt;
                &lt;div id="green-frame" class="product-frame"&gt;
                    &lt;a class="purchase-btn" href="#"&gt;Purchase this item&lt;/a&gt;
                    &lt;img alt="women jean" src="imgs/jean.jpg"&gt;
                &lt;/div&gt;
            &lt;/div&gt;


            &lt;span class="outfit-no"&gt;outfit no.&lt;span&gt;01&lt;/span&gt;&lt;/span&gt;
            &lt;a class="buy-outfit" href="#"&gt;Buy outfit&lt;/a&gt;
        &lt;/div&gt;
</code></pre>

<p>visit : <a href="http://jsbin.com/iquxaq/3" rel="nofollow">http://jsbin.com/iquxaq/3</a></p>
