Add/Remove Class - Custom Pagination

I am trying to create a click event that will capture:

• What the current page # is (based on current class)
• What the next page will be (I can use next())

Also I am trying to get my "selected" class to add/remove based on the page you're on.

If you're on page 2, page 2 has the class "selected" - once you click page 3, the class is removed then added to page 3.

Any ideas? Below is the code I am working with:

 $('#pagination .page').live("click",function(event) {
    event.preventDe开发者_高级运维fault();
    $(this).removeClass("selected");

    cur_page = $(this).html() // grab the current page
    $(this).addClass("selected");
    var page_offset = offset * cur_page; // find the page offset

    console.log(page_offset);
    displayCards();

    $.get('ajax/test.html', function(data) {
        $('.result').html(data);
    });

});

---

If I understod you correctly it was to remove the old selected item that wasn't working. If so this should help.

$('#pagination .page').live("click",function(event) {
    event.preventDefault();
    $('#pagination .page.selected').removeClass("selected");

    cur_page = $(this).html() // grab the current page
    $(this).addClass("selected");
    var page_offset = offset * cur_page; // find the page offset

    console.log(page_offset);
    displayCards();

    $.get('ajax/test.html', function(data) {
        $('.result').html(data);
    });

});

---

These well implemented solutions should be able to help you..

http://d-scribe.de/webtools/jquery-pagination/demo/demo_options.htm

http://demo.tutorialzine.com/2010/05/sweet-pages-jquery-pagination-solution/demo.html