html rangelider javascript无法正常工作且没有错误

Question

在我的rails应用程序中，我想为嵌套表单的rangeliders添加一个输出。 我找到了这个CodePen：http://codepen.io/thelifemgmt/pen/CeLqA

我的东西：
_task_fields.html.haml

.nested-fields
  .range-slider
    = f.input :ur, as: :range, input_html: { min: '1', max: '4', class: 'range-slider__range'}
  %span.range-slider__value 0

的application.js

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require cocoon
//= require_tree .

var rangeSlider = function(){
  var slider = $('.range-slider'),
      range = $('.range-slider__range'),
      value = $('.range-slider__value');

  slider.each(function(){

    value.each(function(){
      var value = $(this).prev().attr('value');
      $(this).html(value);
    });

    range.on('input', function(){
      $(this).next(value).html(this.value);
    });
  });
};

rangeSlider();

它没有用，我没有收到错误。