Outsourcing jQuery request on solr in external javascript

I am trying to outsource my inline javascript into an external one. The inline code looks like this and it works fine.

    <script type="text/javascript">
    $.getJSON('../servlets/solr/select?q=mods.genre:issue_a&state:published&rows=1&
    fl=returnId,id,search_result_link_text,parentLinkText,mods.title&sort=modified
    desc&wt=json',
    function (data) {
    $(data.response.docs).each(function(i, doc){
    let ausgabe = "Ausgabe: ";
    let titelmain = doc['search_result_link_text'];
    let titelall = doc['mods.title'];	
    for (let i=0, item; item=titelall[i]; i++) {
    if (item.indexOf(titelmain)>=0) {
    titelall.splice(i,1);
    } 
    	}
    let titel = titelall.join(' ' + '|' + ' ');					
    $('#periodicals').append($('<div class="modified"></div>')
    				.append('<p class="lastmod-p interline text-content">' + 
    '<span class="fa fa-arrow-right text-info" />' + ' ' + 
    '<span style="font-weight:bold">' + (doc['parentLinkText']) + 
    '</span>' + '<br/>' + '<a class="navbar-link" style="font-weight:bold" href="../receive/'+doc['returnId']+'">' + doc['search_result_link_text'] + '</a>' + '<br/>' + titel + '</p>' + '<p/>')
    					);
    				});	
    			});
    </script>

The external javascript (new.js) looks like this.
It is stored inside the same folder as the html (index.html) invoking it.

$(document).ready(function(){
jQuery.getJSON('http://localhost:8282/mir/servlets/solr/select?q=mods.genre:journal&state:published&rows=2&fl=id,search_result_link_text,mods.title,mods.title.main,sb_amt,sb_ort&sort=modified desc&wt=json',
	function (data) {
	  $(data.response.docs).each(function(i, doc){		
		let amt = doc['sb_amt'] ? doc['sb_amt'] : ' ';
		let ort = doc['sb_ort'] ? doc['sb_ort'] : ' ';
		let alletitel = doc['mods.title'];
		let titel = alletitel.slice(1);
		titel = titel.join(' ' + '|' + ' ');
		let meta = [titel,amt,ort];			
		let text = meta.join(' ' + '|' + ' ');
		$('#periodicals').append($('<div class="modified"></div>')
						.append('<p class="lastmod-p interline text-content">' + 
 '<a class="navbar-link" style="font-weight:bold" href="../receive/'+doc['id']+'">' + doc['search_result_link_text'] + '</a>' + '<br/>' + text + '</p>')
		);
	});	
});
alert('New Documents');
});

I added alert to be sure that the external javascript is beeing resolved.
The alert text pops up correctly but there is no data displayed.
In my HTML Code I have this:

    <script src="new.js"></script>
    <div class="col-md-4">
    	<h4 class="text-dark font-weight-bold" style="">PERIODICALS</h4>
    	<div id="periodicals"></div>
    	<a style="vertical-align:top" href="../servlets/solr/select?q=mods.genre:journal&  
    state:published&sort=modified desc"></a>
    </div>