I have this code :
<label class='textFontSmall center' for="usr" id="addNameText">BOB</label>
And I want the ability to change the text from BOB to Cliff. I have tried 4 different ways :
document.getElementById('addNameText').value = 'CLIFF';
document.getElementById('addNameText').text = 'CLIFF';
document.getElementById('addNameText').html = 'CLIFF';
document.getElementById('addNameText').innerHtml = 'CLIFF';
None of these work. How come ? I must be missing something simple
Use this :
document.getElementById('addNameText').innerText = 'CLIFF';
Or this :
document.getElementById('addNameText').innerHTML = 'CLIFF';
jsfiddle is not a good tool in this case, cause the JavaScript has to be executed after the html:
<label class='textFontSmall center' for="usr" id="addNameText">BOB</label>
You have an example here : http://www.w3schools.com/js/tryit.asp?filename=tryjs_change_innerhtml
Use this $("#addNameText").text('CLIFF');
How about this --
$(document).ready(function(){
$('#addNameText').html('CLIFF');
});
After changing the settings of JS Fiddle's second <select> list to "no wrap - in <body>" (which means the <script> containing the supplied JavaScript (from the JavaScript panel) is inserted into the <body> element, as the last-child before the </body> closing tag (and therefore is executed after the DOM is constructed, you can simply use:
document.getElementById('addNameText').textContent = 'CLIFF';
Or, correcting the typo in your call to innerHTML (you used the camel-case: innerHtml, which is non-existent property of an HTMLElement):
document.getElementById('addNameText').innerHTML = 'CLIFF';
