How to store course other than dropdown menu and open new textbox put other educations?

Model field - degree, institute, percentage these are the model field.

If course is other than dropdown menu so select "Other" and display textbox for enter user education. and when form submit i want to store education in degree column. but now i am not able to handle these two value.

education.html.erb file

  <p>
    <%= f.label :user_id, "Select User.*" %>
    <% if params[:user_id] != nil %>
      <%= f.select :user_id, :collection => User.where(:id => params[:user_id]).map{|u| ["#{u.firstname}, #{u.lastname}", u.id]} %>
    <% else  %>
      <%  @selected_user_id = EducationInformations.where(:id => params[:id]).pluck(:user_id).first  %>
      <%= f.select :user_id, :collection => User.where(:id => @selected_user_id).map{|u| ["#{u.firstname}, #{u.lastname}", u.id]} %>
    <% end  %>  
  </p>   
  <br/> 
  <% course = ["MCA","BCA","BSC","Engg","Diploma in computer science","Other"] %>
  <p>
    <%= f.label :degree, "Select Course.*" %>
    <%= f.select :degree , :collection => (course) %>
  </p>
  <div id="other_edu">
    <br/>
    <p>
      <%= f.label :other_degree, "Enter your course" %>
      <%= f.text_field :other_degree , :id => "other_course", :onblur => "getCourse()" %>
    </p>
  </div>
  <br/>
  <p>
    <%= f.label :institute, "Institute*" %>
    <%= f.text_field :institute %>
  </p>
  <br/>
  <p>
    <%= f.label :percentage, "Grade/Percentage" %>
    <%= f.text_field :percentage %>
  </p> 


javascript

$(document).ready(function() {

    var select = document.getElementById('education_informations_degree');
    var other_course = document.getElementById('other_course');
    $('#other_edu').hide(); 

        select.onchange = function() {
            var selected_course =  select.value;
            if (selected_course == "Other")
            {
                $('#other_edu').show(); 
            }else{
                $('#other_edu').hide(); 
            }

        }

    });

function getCourse() {
        var x = document.getElementById("other_course"); 
        var select = document.getElementById('education_informations_degree');
        select.value = x.value;
        console.log(x.value);
    }