How do I create interactive form with simple_form gem using jquery

I am beginner programmer and working with ruby on rails. I am trying to make web page for transaction entry. I have field "enterytype". When I select enterytype = income, the credit input should pop-down or visible in the form so user cannot confused with debit. same way, when I select enterytype = expense, the debit input should visible in the form. I have try something similar like here How do I create an interactive form with Simple Form? discussed.

Can some help me to find out what I am doing wrong? my codes as following

app/view/transactions/_form.html.erb

<%= simple_form_for(@transaction) do |f| %>
  <%= f.error_notification %>

<fieldset>
<div class="form-inline">
  <%= f.input :date, :input_html => { :maxlength => 10, :style => 'width :100px; hight :100px' } %>
</div>
  <%= f.association :enterytype, :label => "Type of Entry", prompt: '--select--', :label_html => { :class => "control-label" }, :wrapper_html => { :class => "controls" }, :input_html => { :maxlength => 10, :style => 'width :100px' } %>
  <%= f.association :description, prompt: '--select--', :input_html => { :maxlength => 10, :style => 'width :100px' } %>
  <% if false %>
  <%= f.input :amount, as: :currency, :input_html => { :maxlength => 100, :style => 'width :200px' } %>
  <% end %>
<div style="display: none;" data-show-for="Income">
  <%= f.input :credit, as: :currency, :input_html => { :maxlength => 100, :style => 'width :200px' } %>
</div>
<div style="display: none;" data-show-for="Expense">
  <%= f.input :debit, as: :currency, :input_html => { :maxlength => 100, :style => 'width :200px' } %>
</div>

<div class="form-actions">
  <%= f.button :submit, :class => "btn btn-primary" %>
</div>
</fieldset>
<% end %>

app/assets/javascript/application.js

$('#enterytype').on('change', function(){
   var option = $(this).find(':selected');
   $('[data-show-for]').hide(); //And maybe reset?
   $('[data-show-for='+ option.text() +']').show();
});