chrome not running an EventListener : I'm having an issue with chrome, I have tried to create a button that adds a new input tag when the button is pressed. Now the below code works totally fine on internet explorer however in chrome nothing happens at all. 

I also get no errors on the console the function just doesn't seem to run.

I've tried replacing it with just the ` $("#addto").append(input1);` with  `alert("hello world");` just to see if the code ran at all and it doesn't.


Html    

    <div class="modal-footer">
    		<button id="addinput" type="button" class="btn btn-default">add</button>
    </div>

Javascript
    
    window.onload = function () 
    {
      var buttonElement = document.getElementById("addinput");
          
      if (buttonElement) 
      {
        buttonElement.addEventListener('click', addinput);
      }
    
      function addinput() 
      {
    
    	var input1 = '<div class="input-group mb-3"><div class="input-group-prepend"><span class="input-group-text" id="basic-addon1">Name</span></div><input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1"></div>';
    	$("#addto").append(input1); 
    		    		
       }
    }

