Console logging for any site

logger.js

(function () {
		document.body.innerHTML += '<div id="log"></div>';
    document.head.innerHTML += '<style>#log{position:fixed;bottom:0;right:0;left:0;height:150px;font:12px monospace;background-color:rgba(0,0,0,.6);color:#eee;overflow-y:auto}#log .log-message .log-ts{opacity:.6}#log .log-message.severity-info{background-color:#add8e6;color:#fff}#log .log-message.severity-warn{background-color:#ff0;color:#222}#log .log-message.severity-error{background-color:pink;color:#e00}</style>';
    if (!console) {
        console = {};
    }
    var old = console.log;
    var logger = document.getElementById('log');
    console.log = function (message) {
        if (typeof message == 'object') {
            logger.innerHTML += (JSON && JSON.stringify ? JSON.stringify(message) : String(message)) + '<br />';
        } else {
            logger.innerHTML += message + '<br />';
        }
    }
    function _toMessage(args) {
    	var msg = ['<span class="log-ts">' + new Date().toISOString() + '</span>'];
      for (var i = 0; i < args.length; i++) {
      	if (typeof args[i] === 'string' || typeof args[i] === 'number') msg.push(args[i]);
        else if (typeof args[i] === 'object') msg.push(JSON.stringify(args[i]));
        else msg.push(args[i].toString());
      }
      return msg.join(' ');
    }
    function _log(severity) {
    	var args = Array.prototype.slice.call(arguments, 1);
      logger.innerHTML += '<div class="log-message severity-' + severity + '"><b>' + severity.charAt(0).toUpperCase() + '</b> ' + _toMessage(args) + "</div>";
      logger.scrollTop = logger.scrollHeight;
    }
    console.log = _log.bind(null, 'log');
    console.info = _log.bind(null, 'info');
    console.warn = _log.bind(null, 'warn');
    console.error = _log.bind(null, 'error');
})();