Search code examples
javascriptstylesheetfont-sizeinnerhtml

Can I add a style tag to innerHTML?


I'm trying to post an innerHTML table. Would like the font size in one cell to be bigger. Is it possible to include a style tag like so?

cell4.innerHTML = "<style: font-size:40px>" + "John Doe" + "</style>" +  "</br>";

I tried the following fiddle, but it isn't working. http://jsfiddle.net/s1dj3x8e/


Solution

  • The <style> tag is meant to be a container for CSS code inside the head, so what you're trying to accomplish cannot be done with that element in this context.

    Try replacing the following line:

    cell4.innerHTML = "<style: font-size:40px>" + "John Doe" + "</style>" +  "</br>";
    

    With:

    cell4.innerHTML = "<span style='font-size:40px'>John Doe</span>";
    

    Updated fiddle (now with span instead of div as correctly pointed out by Zach below):

    http://jsfiddle.net/jbhw1qf0/