Client-side Message Queue/Output

function MessageOutput() { } MessageOutput.prototype = { /** * A reference to the output container */ container : null, /** * Template element */ template : null, init : function() { // Assumes an already created ul element with an ID of "output" this.container = document.getElementById('messages'); // Create the template for copying into the DOM this.template = document.createElement('li'); }, display : function(message) { var new_node = this.template.cloneNode(true); new_node.setAttribute('class', message.type); new_node.appendChild(document.createTextNode(message.content)); this.container.appendChild(new_node); } } var message_output = new MessageOutput(); window.addEventListener( 'load', function() { MessageOutput.prototype.init.apply( message_output, arguments ); }, false ); function Messenger() { } Messenger.prototype = { /** * Add a message to the specified queue */ add : function(message, type) { window.message_output.display( { "content" : message, "type" : type } ); } } var messenger = new Messenger(); function displayMessage() { messenger.add(document.getElementById("text").value, "test"); document.getElementById("text").value = ""; }