Как сделать так что бы скрипт jQuery постоянно следил за обновлением HTML?

Question

[GoldSlide]

Всем привет , собственно установил на сайт кнопку "показать еще" она подгружает товары со страницы пагинации , но скрипт добавления в корзину не отрабатывает на этих товарах,собственно он не следит за обновлением контента HTML
Вот сам скрипт :

$("button.cad").click(function(){		
		var node = $(this);
		$.ajax({
			url: "/js/jx.php",async:false,cache:false,type:"post",dataType:"text",
			data:{"mode":"1","guid":$("#size-"+$(this).attr("rel")).val()},
			success: function(response){	
				goal('callback_add_to_cart');
				UM();
				msgBox('200','<h3>Корзина</h3>Товар добавлен в корзину.<br><a href="/shopping-cart/">Перейти в корзину</a>');
				node.html('Готово').show("pulsate",{times:3});
			}
		});
		return false;
	});

Как сделать так что бы он отрабатывал и на новых товарах?

Answer 1

[Rsa97]

$('body').on('click', 'button.cad', function() { ... })

Comments

[GoldSlide]

увы, не работает

[damn]

GoldSlide, работает. Гуглите всплытие.

[GoldSlide]

damn, Спасибо!
все работает , ошибся местом вставки)

Answer 2

[Виталий Б]

$(document).on('click', '.cad', function() {

});

Comments

[Виталий Б]

GoldSlide, Так, значит трабл не вижу. Для динамически созданных DOM узлов конструкция $(document).on всегда работает.
То есть так в консоль у вас не выводит ничего?
$(document).on('click', '.cad', function() {
console.log('action_1');
});