Coffee error undefined is not a function (near '...$(document).on...')

I am trying to implement a dynamic form in a Rails App through AJAX and did a couple of tutorials, but without success.

The Coffee part from my asset folder

$ ->
  $(document).on 'change', '#lands_select', (evt) ->
    $.ajax 'update_shipping',
      type: 'GET'
      dataType: 'script'
      data: {
        land_id: $("#lands_select option:selected").val()
      }
      error: (jqXHR, textStatus, errorThrown) ->
        console.log("AJAX Error: #{textStatus}")
      success: (data, textStatus, jqXHR) ->
        console.log("Dynamic lands select OK!")

For this form in a view:

<%= form_for :cart, :url => {:action => "show_shipping"}, :html => {:method => "get"} do |f| %>
  <%= f.select(:land_id, options_for_select(@lands.collect { |l| [l.name.titleize, l.id] }, 0), {}, {:id => 'lands_select', :prompt => "select a country"}) %>
  <%= f.select(:shippingservice_id, options_for_select(@shippingservices.collect { |s| [s.title.titleize, s.id] }, 0), {}, {:id => 'shippingservices_select', :prompt => "select a carrier"}) %>
  <%= f.submit "Calculate shipping" %>
<% end %>

Which gets rendered as:

<form accept-charset="UTF-8" action="/carts/show_shipping/4" method="get">
  <div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
  <select id="lands_select" name="cart[land_id]" prompt="select a country"><option value="1">Afghanistan</option>
  ...
  <select id="shippingservices_select" name="cart[shippingservice_id]" prompt="select a carrier"><option value="7">Standard</option>
  ...
  <input name="commit" type="submit" value="Calculate shipping" />
</form>

produces an

TypeError: undefined is not a function (near '...$(document).on...')         

I have jQuery in my Javascript directory.

Why does this happen and how can I solve this?