title: jQuery pagination + Twitter Bootstrap
body: <p>I'm trying to modify a Jquery pagination (<a href="http://web.enavu.com/tutorials/making-a-jquery-pagination-system/" rel="nofollow noreferrer">based on this Jquery pagination tutorial</a> - <a href="http://web.enavu.com/demos/paginate/" rel="nofollow noreferrer">demo</a>) to work with the awesome twitter bootstrap.</p>
  
  <p>Twitter Bootstrap's standard pagination setup looks like this, so this is the goal for the pagination output structure.</p>
  
  <pre><code>&lt;div class="pagination"&gt;
      &lt;ul&gt;
          &lt;li class="prev disabled"&gt;&lt;a href="#"&gt;&amp;larr; Previous&lt;/a&gt;&lt;/li&gt;
          &lt;li class="active"&gt;&lt;a href="#"&gt;1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;2&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;3&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;4&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;5&lt;/a&gt;&lt;/li&gt;
          &lt;li class="next"&gt;&lt;a href="#"&gt;Next &amp;rarr;&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So far I can get it to work by changing the html output structure but the active highlighting is not working proper since I changed the output from <code>&lt;a&gt;</code> to the <code>&lt;li&gt;</code> tag.</p>
  
  <p><a href="http://guldmand.com/paginate/index3.html" rel="nofollow noreferrer">This is where I am stuck now ATM!</a></p>
  
  <h2>I still need to do the following:</h2>
  
  <ul>
  <li>Disable <code>prev</code> button, when on first page</li>
  <li>Change Active <code>&lt;li&gt;</code> when page is changed</li>
  <li>Disable <code>next</code> button when on last page</li>
  <li>Fix the <code>prev</code> button so it works again</li>
  <li>fix the next button so it works again</li>
  </ul>
  
  <p>Heres the link to the <a href="http://jsfiddle.net/guruguldmand/kybmP/1/" rel="nofollow noreferrer">JsFiddle</a> - <em>somehow it's not working, but the code should be correct (<a href="http://guldmand.com/paginate/index3.html" rel="nofollow noreferrer">same code as this</a>)</em></p>