Javascript-форум - Получение значения атрибута для параметра JQuery UI Слайдера

Здравствуйте! Решил сделать несложный фильтер для сайта, но повис на мелком: http://jqueryui.com/slider/#rangemax
Есть слайдер, вот его html код: <div data-min="0" data-max="30000" class="f-slider">
Причём он будет в дальнейшем не один, поэтому попытался универсально написать на JQ:

$(function() {
	$('.f-slider').slider({
		range: true,
		animate: true,
		min: $(this).data('min'),
		max: $(this).data('max'),
		values: [ $(this).data('min'), $(this).data('max') ],
		slide: function( event, ui ) {
			$(this).parent('.f-slider-block').parent('.f-value').children('.min-value').val(ui.values[0]);
			$(this).parent('.f-slider-block').parent('.f-value').children('.max-value').val(ui.values[1]);
		}
	});			
	$(this).parent('.f-slider-block').parent('.f-value').children('.max-value').val( $('.f-slider').slider('values', 0) + $('.f-slider').slider('values', 1));
});

Однако при $(this).data('max') почему-то не возвращается значение атрибута.
Элементы с классами min-value и max-value - обыкновенные текстовые поля.
Подскажите, в чём ошибка?
Заранее спасибо!
P.S. при attr тоже самое.

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jQuery UI Slider - Range slider</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> <script> $(function() { $('.f-slider').each(function (i, b) { var max = $(b).data('max'), min = $(b).data('min'), parent = $(b).parents('.f-value'), min_input = $('.min-value', parent),max_input = $('.max-value', parent); $(b).slider({ range: true, animate: true, min: min, max: max, values: [ min, max ], slide: function( event, ui ) { min_input.val(ui.values[0]); max_input.val(ui.values[1]); } }); min_input.val( min); max_input.val( max); }); }) </script> </head> <body> <div class="f-value"> <input type="text" class="min-value"> <input type="text" class="max-value"> <div class="f-slider-block"> <div data-min="0" data-max="30000" class="f-slider"></div> </div> </div> <div class="f-value"> <input type="text" class="min-value"> <input type="text" class="max-value"> <div class="f-slider-block"> <div data-min="0" data-max="500" class="f-slider"></div> </div> </div> </body> </html>