How to catch all javascript warnings and errors to an output div?

First of all, get rid of the try catch. Don't use try catch when you are debugging.

Second, you don't want to out errors to a div, use firebug or inspector for that - console.log();

Third, if you really want to do it: you could use try catch and in the catch, use something like

$('body').append($('div').html('variable for error message goes here'));

if you are using jquery

OR

document.getElementByTagName("body").appendChild( document.createTextNode("variable for error message goes here") );

if you have plain javascript

EDIT: try looking up ie debug bar , ie webDeveloper

I understand myself why someone may want something to actually happen when an error occours in the document. The answers above just say that you would use developer tools, but I needed things to actually happen, and after some searching, here's what I found...

If you wish to catch all errors that come through, you can put the following code into your file, best at the top:

window.onerror = function(errorMsg, url, lineNumber){
    // any action you want goes here
    // errorMsg is the error message itself.
    // url should be the file presenting the error, though i have
    //    found that it only presents to me the address of the site.
    // lineNumber is the line number the error occoured on.
    // here is an example of what you could do with it:
    alert("Error in " + url + " at " + lineNumber + ":\n" + errorMsg);
}

I, myself, like to output the errors to a div that contains them all, though you can do literally anything to this information that you could do with any other string passed to a function.

Here is an example of what may happen if you throw an error with a button using the code above:

Error in your.site.here at 1:

Uncaught ReferenceError: foo is not defined