Changing Input Name Using JQuery

Today's lesson is to change input name based on form drop down type when on change function triggered.


Form 

<div class="form-group">
    <label class="col-lg-2 control-label">Material Type</label>
    <div class="col-lg-6">
          {!! Form::Dropdown('material_type', $typeselection, (!empty($profile->material_type)) ? $profile->material_type : '','id="repeat-frequency" required') !!}
    </div>
  </div>

  <div class="form-group required">
    <label class="col-lg-2 control-label">Borrowing Period</label>
    <div class="col-lg-6">
      <div class="input-group">
        <input id="borrow" name="borrow_period" type="number" min="0" class="form-control" placeholder="" value="{{ old('borrow_period',  isset($profile->borrow_period) ? $profile->borrow_period : null) }}" required>
        <span class="input-group-addon">Days</span>
      </div>
    </div>
  </div>

JQuery

<script type="text/javascript">
  $( document ).ready(function() {

    $('#repeat-frequency').on('change', function(){
      var frequency = $('#repeat-frequency').val();
      if(frequency == 1 ){
        $('#repeat-every').text("Maximum Books");
        //option 1 select id
        document.getElementById("borrow").setAttribute('name', 'borrow_book');
      } else if (frequency == 2){
        $('#repeat-every').text("Maximum CD/DVD");
        //option 2 select id
        $('#borrow').attr("name","borrow_cd");
    });

  });
</script>