JavaScript function to link a CSS stylesheet on click

Question

I want to link a CSS stylesheet on click of the following link (stylized as a button):

<a class="changeView-left" onclick="loadcssfile()" href="#"></a>

Here is my JavaScript code:

function loadcssfile(){
    var fileref=document.createElement("link")
    fileref.setAttribute("rel", "stylesheet")
    fileref.setAttribute("type", "text/css")
    fileref.setAttribute("id", "mobileSheet")
    fileref.setAttribute("href", alternateView.css)
    document.getElementsByTagName("head")[0].appendChild(fileref)
}

This JavaScript function should load the stylesheet, but it does not, How can I have it load the stylesheet?

Answer 1

This Javascript should load the css file:

function loadcssfile() {
    document.getElementsByTagName("link")[0].setAttribute('href', 'second.css');
}