Live Query: Unordered List Examples (Using Function References)

A common use-case is when a new list item is added to an unordered list and an event should be bound to it or a script notified of the change.

Binding an event to each list item

The list below uses a live query to bind a click event to each list item that changes the text to read 'Clicked'. Expiring the Live Query unbinds the events.

$('ul#example1-1 a')
	.livequery('click', function() { 
		$(this)
			.text('Clicked')
			.blur();
		return false;
	});

Get notified when a list item is added

The list below uses a Live Query to call a function when a new list item is added. This function adds the following text to each list item: '(Updated)' and removes it when the Live Query is expired.

var matched = function() {
	$(this)
		.append('<small>&nbsp;(Updated)</small>');
};
var unmatched = function() {
	$('small', this)
		.remove();
};
$('ul#example1-2 li')
	.livequery(matched, unmatched);