Динамическая загрузка файла css с использованием javascript с обратным вызовом без jQuery

Я пытаюсь загрузить файл css динамически с помощью javascript и не могу использовать другие библиотеки js (например, jQuery).

Файл css загружается, но я не могу получить обратный вызов, чтобы работать на это. Ниже приведен код, который я использую

var callbackFunc = function(){
    console.log('file loaded');     
};
var head = document.getElementsByTagName( "head" )[0];
var fileref=document.createElement("link");
    fileref.setAttribute("rel", "stylesheet");
    fileref.setAttribute("type", "text/css");
    fileref.setAttribute("href", url);

    fileref.onload  = callbackFunc;
    head.insertBefore( fileref, head.firstChild );

Использование следующего кода для добавления тега скрипта для загрузки файла js работает и запускает обратный вызов:

var callbackFunc = function(){
    console.log('file loaded');     
};

var script = document.createElement("script");

script.setAttribute("src",url);
script.setAttribute("type","text/javascript");

script.onload  = callbackFunc ;

head.insertBefore( script, head.firstChild );

Я что-то здесь делаю не так? Я был бы очень признателен за любой другой метод, который может помочь мне в достижении этой цели?