jQuery store and get extra data in html select

jQuery store and get additional extra data in select:

js:

$(function(){
	$('select').change(function() {
		alert( $('select').val() ); // alerts "val1"
		alert( $('select option:selected').text() ); // alerts "text1"
		alert( $('select option:selected').data('extra') ); // alerts "extra1"
	});
});

html:

<select name="select">
	<option value="val1" data-extra="extra1">text1</option>
	<option value="val2" data-extra="extra2">text2</option>
	<option value="val3" data-extra="extra3">text3</option>
</select>