javascript - For loop to change value of dropdown menu in jQuery -

i have drop down menu lists years 1970 present. @ moment in embedded javascript within html. i'm trying use external file perform same function jquery, i'm having difficulty.

this current method display drop down menu:

<h4 class="form_title">time span</h4></br> <label for="select" class="col-lg-2 control-label">from:</label> <div class="col-lg-3">     <select class="form-control" name="timestart" id="select">         <option value="" selected disabled>select</option>         <script type="text/javascript">             // current year , use loop populate options             var year = new date().getfullyear();             for(i = year; >= 1970; i--) {                 document.write('<option value="' + + '">' + + '</option>');             };         </script>     </select> </div> <!-- col-lg-3 --> 

this works fine want separate logic view. have tried removing script entirely file , adding following in javascript file so:

var year = new date().getfullyear();  $("#select").change(function() {     console.log("calling function successfully...");     for(i = year; >= 1970; i--) {         document.write('<option value="' + + '">' + + '</option>');     } }); 

i put console.log in there see if function being called when select menu (which isn't). have been trying many variations on can't figure out i'm doing wrong (probably several things). should selecting select tag or option tag?

move code ready , use append add option select.

var year = new date().getfullyear();  $(document).ready(function () {     console.log("calling function successfully...");     var options = '';     (i = year; >= 1970; i--) {         options += '<option value="' + + '">' + + '</option>';     }      $('#select').append(options); });