[javascript] How to write inside a DIV box with javascript

I'm making a mini-game where a player attacks a npc and in the center is a white box (div) that I call (log), because when the player damages/attacks the npc, I want to be able for that open white space to log what happened.

I'm using the getElementById(log) and then adding something along the lines of "document.write("You attacked X npc"), but its not working.

Any idea on how I can get text INSIDE the box and not outside it? Thanks

You can use one of the following methods:

document.getElementById('log').innerHTML = "text";

document.getElementById('log').innerText = "text";

document.getElementById('log').textContent = "text";

For Jquery:

$("#log").text("text");

$("#log").html("text");

If you are using jQuery and you want to add content to the existing contents of the div, you can use .html() within the brackets:

$("#log").html($('#log').html() + " <br>New content!");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>_x000D_
<div id="log">Initial Content</div>

I would suggest Jquery:

$("#log").html("Type what you want to be shown to the user");   

HTML:

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

JS:

document.getElementById("log").innerHTML="WHATEVER YOU WANT...";