Change Default apple-touch-icon

Is there a way to change my app's "apple-touch-icon"?

I have used to have the following javascript code in my app:

(function changeMobileIcon() {

  var y = document.createElement('link');

  y.type = 'image/x-icon';

  y.rel = 'apple-touch-icon';

  y.href = '';



But it no longer works.  Anytime the app is added as a home screen bookmark to an Android or iOS device, the icon is now replaced by the default Knack icon.  Any suggestions?

/* Change Icon */

function ChangeFavicon() {
var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = 'https://YOURURL/favicon.ico'; //path to your icon

/* Add to Home Screen icons. */
$("head").append("<link rel='apple-touch-icon-precomposed' sizes='57x57' href='https://YourURL/apple-touch-icon-57x57.png' />");
$("head").append("<link rel='apple-touch-icon-precomposed' sizes='72x72' href='https://YourURL/apple-touch-icon-72x72.png' />");
$("head").append("<link rel='apple-touch-icon-precomposed' sizes='114x114' href='https://YourURL/apple-touch-icon-114x114.png' />");
$("head").append("<link rel='apple-touch-icon-precomposed' sizes='144x144' href='https://YourURL/apple-touch-icon-144x144.png' />");


Did anyone ever work out how to do this? 


Given that a web app has a fairly long URL for typing into a phone browser and the fact that it is likely password protected as well, any way to shortcut the loading process would be great.  So getting clients to add the app to their home screen is key to adoption and usage but that being said having a custom icon for the home screen should be a setting option in Knack.


I'm trying to figure out how to make the favicon / shelf icon / smart device icon our company or event logo, would love to know if/when there is a solution.