jQuery not reading selected option after refresh

jQuery not reading selected option after refresh

Morning,
I have a select box which looks like this:
<select id="companyselect" name="companyselect">
<option value="-1">Please choose company</option>
<option value="CO1">CO1</option>
<option value="CO2">CO2</option>
<option value="CO3">CO3</option>
<option value="CO4">CO4</option>
</select>
All options, apart from the first, are generated using jQuery (from
localStorage) and appear as they should.
I have a jquery function which is triggered on the 'change' event:
$(document).on('change', '#companyselect', function(e){
thecomp = $('#companyselect').val();
alert(thecomp);
});
This all works fine.
However, when I reload the page, all options are generated as expected but
the 'change' event is not working as required. No matter what option is
selected, $('#companyselect').val(); is always returned as the first
option.
I have checked the DOM to see if there is another element with the same
id, but no. I have tried returning the text of the option, and it returns
the text of the first option.
All suggestions are most welcome.