Split jQuery cycle pager into divs <p>I have a jQuery cycle slider working fine, but the pager I need split into different places. The paging itself works, but the active slide is the same for each div - i.e. for the first slide, the first pager in each div will show as active. I'm having a hard figuring out how to solve this problem! </p> <p>An example of what I'm trying to achieve is the paging of this site <a href="http://www.cote-carmes.com/en-en/rooms.php" rel="nofollow">http://www.cote-carmes.com/en-en/rooms.php</a>.</p> <p>The idea of the markup is as follows:</p> <pre><code>&lt;div id="home-content"&gt; &lt;div class="home-sub first"&gt; &lt;ul class="slide-nav"&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="home-sub"&gt; &lt;ul class="slide-nav"&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="home-sub"&gt; &lt;ul class="slide-nav"&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>And the jQuery I have as follows:</p> <pre><code>$('#home-slider').cycle({ pager: '#home-content ul', pagerAnchorBuilder: function(idx, slide) { // return selector string for existing anchor return '#home-content li:eq(' + idx + ') a'; } }); </code></pre> <p>Please help!</p>