title: using :nth-child to select lines and append
body: <p>I am doing a university project at the minute where I feed information in from a set xml file and then place it into a set div using jQuery as individual paragraphs.</p>
  <p>At the moment, what is being fed in is something like this:</p>
  <pre><code>&lt;p class=&quot;speech&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;line&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;line&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;line&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;line&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;speech&quot;&gt;Blah&lt;/p&gt;
  &lt;p class=&quot;line&quot;&gt;Blah&lt;/p&gt;
  </code></pre>
  <p>Etc.</p>
  <p>One of the requirements of the module is to number every 5th line, which I thought would be easiest done by using something like:</p>
  <pre><code>$(&quot;#contents_txt p:nth-child(5n)&quot;).append(&quot;&lt;span&gt; - 5th&lt;/span&gt;&quot;);
  </code></pre>
  <p>However instead of adding &quot;5th&quot; to the end of each 5th line it is adding it multiple times:</p>
  <blockquote>
  <p>COUNTESS</p>
  <p>In delivering my son from me, I bury a second husband.</p>
  <p>BERTRAM</p>
  <p>And I in going, madam, weep o'er my father's death</p>
  <p>anew: but I must attend his majesty's command, to - 5th - 5th - 5th - 5th - 5th - 5th -     5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th - 5th</p>
  </blockquote>
  <p>I can't figure out why this is happening, because if I change to something like the <code>.css</code> selector, I can apply style to every 5th line fine.</p>
  <p>Any help would be greatly appreciated!</p>
  <p>Thanks in advance!</p>
  <p><strong>EDIT</strong></p>
  <p>I have made a jsfiddle of it: <a href="http://jsfiddle.net/LfpMm/" rel="nofollow noreferrer">http://jsfiddle.net/LfpMm/</a> however it seems to be working in a barebones environment.</p>
  <p>A working example on my end is available: <a href="http://immbudden.com/siab/siab.html" rel="nofollow noreferrer">http://immbudden.com/siab/siab.html</a></p>
  <p>In order to see what I mean: click on a play, click on the contents nav, click on a scene and you'll see whats happening.</p>
  <p>Thanks.</p>