Can I use a variable in JS for my html?

I have a JS file CharacterSelection where a user can select an avatar and type their name into a textarea.

Now I want to set a text div in an html file to the contents of the textarea. I will use it to display the player's name at a specific location on the screen.

I know that I can set a div to a text, such as: <div id ="statSheetExitButton">Exit</div> will show "Exit" (style and location depending on css)

I'm wondering if there is any way to put a String variable in there, si开发者_如何学JAVAnce I will not know what name the player enters.

I grab the textarea's contents using var name = $("#nameTextBox").val();

I'm thinking that saying <div id ="playerName">name</div> will display the text "name".

Is there a way to accomplish my goal?

$("#nameTextBox").change(function(){
  $("#playerName").html($(this).val());
});

This will attach an event handler to the textbox so everytime the name changes the div is updated.

Here is a working example. http://jsfiddle.net/2NkTb/

Please note that for the onchange event you must tab out of textbox or the textbox must lose focus

var name = $("#nameTextBox").val();
$("#playerName").html(name);

Do this:

var name = $("#nameTextBox").val();
$('#playerName').text(name);

You could do something like this which will replace the html of the tag with your JavaScript string:

$('#playerName').html(myNameVar);

Other than that, I don't think you can directly inject JavaScript variables like you would in a template language.

Try:

   $('#playerName').html($("#textbo").val());

var playerName = 'John Dow'
document.getElementById('playerName').innerHTML=playerName

You need to set the property innerHTML of you div element.

$("playerName").innerHTML = name;