JavaScript: Displaying and updating text arrays

Question

Trying to put a paragraph together on canvas with JavaScript from multiple user specified variables. I start off with...

function special01() {
    //clean slate       
    ctxx.clearRect(0, 0, ctx.width, ctx.height);

    //navigations important
    drawNav();

   //lets begin

    var newSlate = "You're feeling colorChoice today!";
    document.getElementById("displayed").innerHTML = 
        newSlate;
    if (user.color == 'blue') {
    var array = newSlate.replace("colorChoice", "blue")
    }
    else if (user.color == 'red') {
    etc..etc..
    };
}

I seem to be forgetting something, and being just a hobbyist, I'm not sure what. Essentially I'm just trying to replace colorChoice with blue when blue has been selected by the user. The selection and user.color is updating correctly when selected.

Answer 1

Have you tried

function special01(){  
  ctx.clearRect(0, 0, ctx.width, ctx.height);
  drawNav();
  document.getElementById('displayed').innerHTML = 'You\'re feeling ' + user.color + ' today!';
}

EDIT

If you really want to replace substring in a string, this is how you can do it

var yourString = 'You\'re feel colorChoice today.';
var user.color = 'blue'; // For example
var newString = yourString.split('colorChoice').join(user.color); // 'You\'re feel blue today.'