jQuery navigation assistance
<p>Updated to fix the markup issue :/</p>

<p><a href="http://jsfiddle.net/G7p2U/1/" rel="nofollow">http://jsfiddle.net/G7p2U/1/</a> that is the link to better understand everything</p>

<p>jQuery I am using is</p>

<pre><code>$(document).ready( function() {
  $(".crumbs a").each( function() {
    $(this).append('&lt;div class="indicator"&gt;&lt;/div&gt;');
  });
var i = 0;
var linkpos= new Array("0,0", "0,110", "0,220", "0,330", "0,440", "0,550", "0,660");
    $(".crumbs").each( function() {
 var s = linkpos[i];
 var x = s.split(",");
 var t = x[0];
 var l = x[1];
$(this).css({ "top":t+"px", "left":l+"px" });
 i++;
 }); 
});
</code></pre>

<p>Problem is that when this was written it worked correctly, now there is the issue. Before the markup was like so</p>

<pre><code> &lt;div class="pun-crumbs"&gt;
    &lt;div class="crumbs"&gt;
     &lt;a href="#"&gt;Index&lt;/a&gt;
   &lt;/div&gt;
  &lt;div class="crumbs"&gt;
     &lt;a href="#"&gt;Profile&lt;/a&gt;
  &lt;/div&gt;
     &lt;div class="crumbs"&gt;
       &lt;a href="#"&gt;Recent&lt;/a&gt;
    &lt;/div&gt;
    &lt;div class="crumbs"&gt;
      &lt;a href="#"&gt;Link 4&lt;/a&gt;
   &lt;/div&gt;
 &lt;/div&gt;​
</code></pre>

<p>Though that is not how the PHP parse's the data markup it actually comes out like so</p>

<pre><code> &lt;div class="pun-crumbs"&gt;
   &lt;div class="crumbs"&gt;
     &lt;a href="#"&gt;Index&lt;/a&gt;
      &lt;a href="#"&gt;Profile&lt;/a&gt;
        &lt;a href="#"&gt;Recent&lt;/a&gt;
         &lt;a href="#"&gt;Link 4&lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;​
</code></pre>

<p>So my trouble is now for some reason I can not get the links to separate like I need them too..</p>

<p>should look like so
<a href="http://jsfiddle.net/nXrDn/" rel="nofollow">http://jsfiddle.net/nXrDn/</a></p>

<p>Any help?</p>

<p>​</p>
