addClass到一个特定的元素

Question

我的问题是因为我几乎不知道有关jQuery的任何事情，我在Bootstrap中使用脚本进行分页（http://www.bootply.com/xu9mT0pPA6），我看到了我所了解的这个行$('.pager .page_link:first').addClass('active');这个类active被添加到之前的锚点，并且它必须被添加到li元素中。

我试图把$('.pager **li** .page_link:first').addClass('active');但它不工作。

非常感谢

编辑：代码：

var listElement = $('#pageStuff'); 
var perPage = 2; 
var numItems = listElement.children().size(); 
var numPages = Math.ceil(numItems/perPage); 

$('.pager').data("curr",0); 

var curr = 0; 
**while(numPages > curr){ 
    $('<li><a href="#" class="page_link">'+(curr+1)+'</a></li>').appendTo('.pager'); 
    curr++; 
} 

$('.pager .page_link:first').addClass('active');** 

listElement.children().css('display', 'none'); 
listElement.children().slice(0, perPage).css('display', 'block'); 

$('.pager li a').click(function(){ 
    var clickedPage = $(this).html().valueOf() - 1; 
    goTo(clickedPage,perPage); 
}); 

function previous(){ 
    var goToPage = parseInt($('.pager').data("curr")) - 1; 
    if($('.active').prev('.page_link').length==true){ 
    goTo(goToPage); 
    } 
} 

function next(){ 
    goToPage = parseInt($('.pager').data("curr")) + 1; 
    if($('.active_page').next('.page_link').length==true){ 
    goTo(goToPage); 
    } 
} 

function goTo(page){ 
    var startAt = page * perPage, 
    endOn = startAt + perPage; 

    listElement.children().css('display','none').slice(startAt, endOn).css('display','block'); 
    $('.pager').attr("curr",page); 
} 

Answer 1

这个小片断增加active类的被点击<li>：

//when the anchor tag is clicked 
$('a.page_link').click(function(){ 
    $('li').each(function(){ 
    //remove all li with class active (this is to remove the previous active) 
    $(this).removeClass('active'); 
    }); 
    //add active to the parent of the clicked a tag 
    $(this).parent().addClass('active'); 
}); 

DEMO

Answer 2

由于li是.page_link的父母，你既可以使用.closest("li")

$('.pager .page_link:first').closest("li").addClass('active'); 

或.parent()

$('.pager .page_link:first').parent().addClass('active'); 

编辑

$('.pager li a').click(function(){ 
    var clickedPage = $(this).html().valueOf() - 1; 

    $(".active").removeClass("active"); 
    $(this).closest("li").addClass("active"); 
    goTo(clickedPage,perPage); 
});