How can I output results to the 'result' window in JSFiddle?

davidkelleher picture davidkelleher · Apr 4, 2014 · Viewed 16.9k times · Source

I've tried using console.log() but I need to have the developer window open in chrome to see the output. Alert() writes to the pop-up box. I want to output to the result window (bottom-right pane) in JSFiddle. Can anyone tell me please?

Updated with a visual of answer by JajaDrinker - thanks for this.

enter image description here

Answer

JajaDrinker picture JajaDrinker · Apr 4, 2014

Add this to the HTML section:

<div id="console-log"></div>

Add this to the JavaScript section:

var consoleLine = "<p class=\"console-line\"></p>";

console = {
    log: function (text) {
        $("#console-log").append($(consoleLine).html(text));
    }
};

Optionally, add this to the CSS to make it more user friendly:

.console-line
{
    font-family: monospace;
    margin: 2px;
}

You can see an example here.