How to get html to print return value of javascript function?

Question

What is the preferred syntax to get html to print return value of javascript function?

function produceMessage(){
    var msg= 'Hello<br />';
    return msg;
}

EDIT: Yikes, too many answers without me clarifying what I meant. I know how to do it via the script tag. However, let's say I wanted to make the message red. Would I just encase the script tag inside my css like so?

<div style="color:red><script>document.write(produceMessage())</script></div>

I guess my main question was, should you be using document.write to get the return values to print?

Answer 1

There are some options to do that.

One would be:

document.write(produceMessage())

Other would be appending some element in your document this way:

var span = document.createElement("span");
span.appendChild(document.createTextNode(produceMessage()));
document.body.appendChild(span);

Or just:

document.body.appendChild(document.createTextNode(produceMessage()));

If you're using jQuery, you can do this:

$(document.body).append(produceMessage());

Answer 2

It depends what you're going for. I believe the closest thing JS has to print is:

document.write( produceMessage() );

However, it may be more prudent to place the value inside a span or a div of your choosing like:

document.getElementById("mySpanId").innerHTML = produceMessage();