The Javascript function does not work from the click - what do I do wrong?

advertisements

I am currently making some accessibility options which make the font size increase or decrease on a page. Following EndangeredMassa's for calling JS from a link it appears not to work!

My current code (which is dummy code with the right IDs which will be used in my actual site), does not even run a Javascript alert, and since I'm not one for Javascript, if anyone could let me know what I'm doing wrong.

HTML

<p id="html">Nice to meet you!</p>
<a id="incFontS" href="#">Increase Text</a>

JavaScript

var incFont = document.getElementById("incFontS");
incFont.onClick = function () {
    window.alert("it ran!");
}

As you can see from my jsfiddle, the code does not work at all, and I haven't even gotten to the part where I start changin the font sizes (geh!).

Any help is greatly appreciated!


Case matters in JavaScript. The correct property name is onclick (with a lowercase 'c'). Try this:

var incFont = document.getElementById("incFontS");
incFont.onclick = function () {
    window.alert("it ran!");
}

Demonstration

Also, be sure to read addEventListener vs onclick for a discussion about different techniques for binding event listeners.