代码会更新颜色，但不会更新实际文本吗？

Question

This chunk of code that I have updates the color of the text but not the actual text...

var lastWordTyped;
var ele = document.querySelector("#my_text");
//code
//...
lastWordTyped = capitalizeFirstLetterOfKeyword(lastWordTyped);
lastWordTyped = lastWordTyped.fontcolor("blue");
ele.innerHTML = lastWordTyped;


function capitalizeFirstLetterOfKeyword(keyword) {

        var word;
        word = keyword.charAt(0).toUpperCase() + keyword.slice(1);
        return word;
    }

When I step through it, is recognizing what the new string should be but it doesnt update the actual text to the new string, but it does change its color. Can anybody provide me with the reason as to why it won't update it?

Answer 1

You haven't declared lastWordTyped, so the capitalizeFirstLetterOfKeyword() gets an 'undefined' as input.

Working demo here: http://jsfiddle.net/yc4mvm1n/1/

var lastWordTyped = "NewWord";
var ele = document.querySelector("#my_text");

lastWordTyped = capitalizeFirstLetterOfKeyword(lastWordTyped);
lastWordTyped = lastWordTyped.fontcolor("blue");
ele.innerHTML = lastWordTyped;

function capitalizeFirstLetterOfKeyword(keyword) {
        var word;
        word = keyword.charAt(0).toUpperCase() + keyword.slice(1);
        return word;
    }

Answer 2

Your code looks fine to me.

http://plnkr.co/edit/mRllGWD2bNTxxyWrJENZ?p=preview

Try posting some more code.

function capitalizeFirstLetterOfKeyword(keyword) {

        var word;
        word = keyword.charAt(0).toUpperCase() + keyword.slice(1);
        return word;
    }

is returning proper capitalized word back, I am assuming that you are setting values to lastWordTyped somewhere in your //code section

Answer 3

Make sure the element #my_text exists before the JS code is run. You can do this by putting the script at the bottom of the body, or by using

window.onload = function() {
    // your code here
}