Using JavaScript to force all my site collections' logos to reference the root site collection is only working on IE

Question

I am working on a SharePoint Server 2013 and I have 4 site collections.

I want to always redirect users to the root site collection if they click on the sites logo from the 4 site collections, so I wrote the following script and added it inside the 4 site collections' master pages:

$(document).ready(function () {
    $("#DeltaSiteLogo a.ms-siteicon-a").prop("href", "/");
    $("DeltaSiteLogo a.ms-siteicon-a").prop("onclick", "");
});

The above workes well in IE (I am using IE11) but in Firefox and Chrome the site logos' url will not reference the root site collection, and will keep referencing each site collection root site.

Can anyone advice on this please?

Answer 1

You seem to miss a # on your second line of jQuery, change as below

$(document).ready(function () {
    $("#DeltaSiteLogo a").prop("href", "/");
    $("#DeltaSiteLogo a").prop("onclick", "");
});

or set it in a one-line

$(document).ready(function () {
    $("#DeltaSiteLogo a").prop("href", "/").prop("onclick", "");
});

If that does not work it may be a timing issue, try wrapping it as below:

SP.SOD.executeFunc('sp.js','SP.ClientContext', function(){
    $("#DeltaSiteLogo a").prop("href", "/").prop("onclick", "");
});

Answer 2

This might not be the best approach but why dont you try building the root site collection url

$(document).ready(function () {
   var rootSite=window.location.protocol+"//"+window.location.host
   $("#DeltaSiteLogo a").attr("href", rootSite)        
});

Answer 3

Try it as below:

$(document).ready(function () {
    $("#DeltaSiteLogo a").attr("href", "/")        
});