javascript - Only first page of table is clickable when using pagination - List.js -

i using list.js search , pagination table contains on 200 rows. have click event fires if row clicked , brings modal. problem click event firing rows on first page of table when paginated.

    var testlist = new list('test-list', {     valuenames: ['division', 'region', 'location', 'name'],     page: 10000,     plugins: [listpagination({})]     }); 

when have page limit set 10000 can click of rows because on first page, if set page limit 50 rows on first page clickable. have buttons in each row clickable when on first page well.

i tried make simplest codepen possible display this:

http://codepen.io/cavanflynn/pen/jpvevb

an alert pops when list items on first page clicked, not of subsequent pages.

does know going or think of workarounds? thanks!

since you're using jquery anyways, why not this?

$('#test-list').on('click', 'li', function() { alert("these work, rest don't :(") })

edit in response comment:

from jquery documentation:

event handlers bound selected elements; must exist @ time code makes call .on().
...
delegated events have advantage can process events descendant elements added document @ later time.

so want select table itself, inside .on() select event , element want trigger event on.