Change font size using document.getElementById

Question

I am trying to use document.getElementById to change the font size of some text, but for some reason it does not change and it remains at 200%. What am I doing wrong.

#detail {
font-size: 200%;
}

<div id = "detail"> Hello World <div>

<script type = "text/javascript">

if (true) {
document.getElementById(detail).style["font-size"] = "100%";
}

</script>

Answer 1

You should have some quotes for details. and try detail.style.fontSize instead of detail.style ["font-size"]

var detail = document.getElementById("detail");
detail.style.fontSize = "100%";