A helper function for teachers to console log to the HTML document.

#window.console.document()

(function() {
	if (window.console.document) {
	  return
	}
	window.console.document = function() {
		const args = Array.prototype.slice.call(arguments)
		window.document.body.innerHTML = `<div id="__window_console_document__" style="padding:20px; font-size:20px; color: black">${args.join(' ')}</div>`
	}
}())

Here's an example:

console.document('<h1>Hi</h1>','<br>','<i>byex</i>')

Another version if you want to use it with console.log instead.

(function () {
    if (!window.console.document) {
        window.console.document = function () {
            const args = Array.prototype.slice.call(arguments)
            window.document.body.innerHTML = `<div id="__window_console_document__" style="padding:20px; font-size:20px; color: black">${args.reduce((s, arg) => {
                let argV
                if (typeof arg === 'object') {
                    argV = JSON.stringify(arg)
                } else {
                    argV = arg
                }
                return `${s} ${argV}`
            }, '')}</div>`
        }
    }
    const originalConsoleLog = console.log
    console.log = function() {
        originalConsoleLog.call(this, ...arguments)
        console.document.call(this, ...arguments)
    }
}())