Q:

jquery how to access events on html that was inserted to the DOM

In my web app I have an unordered list of 15 items that appear on load. I am grabbing 100 new items from an API using ajax and adding them to the current ul by using .append(html). Each li has a checkbox next to it that when selected needs to call some_function.
The elements that have been rendered are able to access some_function but not the newly loaded ones. How can I access some_function on the newly loaded ajax items? I've never dealt with this before and apparently since the items aren't "rendered" yet they can't access functions?

A:

Without seeing your code I am guessing that you have bound an event handler directly to the checkboxes
$('input[type="checkbox"]').click(function(event) {
    // Your code
});

To make this work with content added after the handler was created you would need to use a delegated handler that binds to a lower level, unchanged element and bubbles an event up to the checkboxes. I have used document though it would be advisable to bind it to a dom node further up, most likely the ul that the checkboxes are added to.
$(document).on('click', 'input[type="checkbox"]', function(event) {
    // Your code
});

