This page is a testpage of the jQuery ClassData Plugin - see http://www.bram.us/2009/02/09/accessing-data-saved-in-the-class-property-of-dom-elements-with-jquery/ for details

jQuery ClassData Demo

If all goes well you should've seen an alert with the fetched ids, the links should turn green and a click on a link should alert the data stored. Try it, go click one:

• Laura Bogaert
• Isaï Persyn
• Maarten Bogaert

Code used

jQuery(function($) {

	// get data (with default glue)
	alert('Fetched userIds: ' + $('ul.myfriends a').classData('userid'));

	// set data (with custom glue) + proof that chaining works
	$('ul.myfriends a').css('backgroundColor','lime').classDataGlue(':').classData('extra','foshizzle').css('color','navy');

	// Hook linkz
	$('ul.myfriends a').bind('click', function(evt) {

		// Don't follow link
		evt.preventDefault();
	
		// Get data (notice that we explictly set the glue)
		alert('extra = ' + $(this).classDataGlue(':').classData('extra') + ' , gender = ' + $(this).classDataGlue('_').classData('gender') + ' , userId = ' + $(this).classData('userid'));
	
	});

});