I've attempted to adjust the font size using this code:
document.getElementById("foo").style.fontSize
Unfortunately, this code does not return any results. The CSS styles are all defined within the same document and are not in an external stylesheet. I also tried this approach:
var el = document.getElementById("content");
var style = window.getComputedStyle(el, null).getPropertyValue("font-size");
var fontSize = parseFloat(style);
el.style.fontSize = (fontSize + 1) + "px";
However, this method doesn't seem to work either.
The HTML element causing this issue is here:
<p contenteditable="true" id="content">Write here. Seriously, try it.</p>
And here is the relevant CSS styling:
#content {
line-height: 30px;
margin-top: 22px;
min-height: 90%;
display: block;
padding: 0 20px 0 20px;
font-size:15px;
}