Google Chrome is stupid to understand an easy code

I have a textarea with id="myarea" and a div with id="preview"

I want: if I type like: [B][U][I]Hello World![/B][/U][/I] in textarea and click button, it will automatic convert to: <b><u><i>Hello World!</b></u></i>

This code will work correctly:

function PreView()
{
  var temp = document.getElementById("myarea");
  temp.value = temp.value.replace("[B]", "<b>").replace("[/B]", "</b>");
  temp.value = temp.value.replace("[U]", "<u>").replace("[/U]", "</u>");
  temp.value = temp.value.replace("[I]", "<i>").replace("[/I]", "</i>");
  $("#preview").html(temp.value);
}

But when I try this, it doesn't work:

function PreView()
{
  var temp = document.getElementById("myarea").value;
  temp = temp.replace("[B]", "<b>").replace("[/B]", "</b>");
  temp = temp.replace("[U]", "<u>").replace("[/U]", "</u>");
  temp = temp.replace("[I]", "<i>").replace("[/I]", "</i>");
  $("#preview").html(temp);
}

I think that Google Chrome is stupid enough to make my code error.

But, if I wrong. Can you tell me why?

Thanks!