Dynamically add meta tag using javascript

Introduction

I have face one  issue that when i am try to run my mobile application in android browser it’s automatically zoom in. So i have change my meta tag like below by changing the initial scale to zero

<meta name="viewport" content="width=device-width, initial-scale=0.0, minimum-scale=0.0, maximum-scale=0.0,user-scalable=0" />

Which works fine in android browser. Then i am try to run my application in IPhone , my application UI become crash. The meta tag needed for Android is little bit different than in the IPhone. So i am checking a condition whether the device is android or iphone and add the meta tag dynamically.

Fix


<script type="text/javascript">

$(document).ready(function () {
$.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());
var isMobile = {
Android: function () {
return navigator.userAgent.match(/Android/i);
},
BlackBerry: function () {
return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function () {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function () {
return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function () {
return navigator.userAgent.match(/IEMobile/i);
},
any: function () {
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};
if (isMobile.Android() && $.browser.chrome) {
document.head.insertAdjacentHTML('beforeEnd', '<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=0" />');
document.getElementsByTagName('head').innerText = document.head.innerHTML;
}
else if (isMobile.Android()) {
document.head.insertAdjacentHTML('beforeEnd', '<meta name="viewport" content="width=device-width, initial-scale=0.0, minimum-scale=0.0, maximum-scale=0.0,user-scalable=0" />');
document.getElementsByTagName('head').innerText = document.head.innerHTML;
} else {
document.head.insertAdjacentHTML('beforeEnd', '<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=0" />');
document.getElementsByTagName('head').innerText = document.head.innerHTML;
}

});

</script>