Multiple javascript files and webkit

Question

Hi everyone.

I have 3 JS files I want to include in my page. The first one is defined statically in the html file. The other two are loaded into the DOM using the following function:

function loadJsFile(pathToFile){
var headID = document.getElementsByTagName("head")[0];         
var newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.src = pathToFile;
headID.appendChild(newScript); }

I then use DOMContentLoaded or onload events to trigger my initiation function combining functions from the 3 files. This works perfectly in Opera, firefox and (I assume) Internet Explorer but doesn't work in Safari or Chrome. For those two browsers, I have resorted to using the onmouseover event.

I then tried and loaded the 3 files statically and that worked but I don't want to do that as I want to load files that will actually be required. If that there is none, then I think my only option would be to statically define them in PHP.

Any ideas or solutions?