debug-element.js

/*
 * Create an element on page that outputs info you pass it.  I use it for IE6 testing
 * Returns a unique element, and also overwrites console.log. Optionally you can pass in an id
 * of an element for which to insert the debug element instead of document body.
 * 
 * Usage:
 * var debug = createDebugElement();
 * debug.innerHTML = 'show my message';
 * 
 * console.log('show my message');
 */

function createDebugElement(within_id) {
    var debug = document.createElement('div');
    var within = within_id ? document.getElementById(within_id) : document.body;
    
    // inserting debug element as first child of given element or body
    within.insertBefore(debug, within.firstChild);
    
    // override console.log to use the element
    if(!window.console) {
        window.console = {};
    }    
    window.console.log = function(message) {
        debug.innerHTML = message;
    }
    
    return debug;
}