如何通过jQuery查找属于动态添加的类的所有元素？

Question

I have dynamically (by jquery) made HTML elements that have classes .foo and .bar , whose all elements are inputs of type checkboxes . I have a button checkAll that checks all the boxes and pushes its id s into an array called selectedBuckets .This button wasn't made dynamically. It looks something like this:

var bucketClasses = [$('.foo'), $('.bar')];
$('#checkAll').click(function () {
    var isAdd = true;       
    var selectedBuckets = [];
    bucketClasses.forEach(function (bucketClass) {
        bucketClass.each(function () {
            this.checked = isAdd;
            if (isAdd)
                selectedBuckets.push(this.id);
        })
    });
});

The problem is that the function is not able to find out the HTML elements that have a class .foo (or .bar for that matter). By putting breakpoints, I see that bucketClass is an empty array while ideally it should be an array of all the checkboxes that have class as .foo . What am I doing wrong?

Answer 1

You should place your var in the click's callback function:

$('#checkAll').click(function () {
    var bucketClasses = [$('.foo'), $('.bar')];
    // all other code as is
});