MrPaul91
MrPaul91

Reputation: 57

javascript not working, onclick function

I have an HTML page with a heading and 2 Divs, I then have a javascript where I want the heading to change if the user selects one off the Divs.

https://jsfiddle.net/L27xqgfs/1/

var happyMood = getElementById("happy");
var sadMood = getElementById("sad");


happyMood.onclick = function () {
    var mainHeading = getElementById("heading");
    mainHeading.innerHTML = "You have selected ";

};

sadMood.onclick = function () {
    var mainHeading = getElementById("heading");
    mainHeading.innerHTML = "You have selected " + sadMood;
};

Please can someone advise where I've gone wrong?

Thanks in advance.

Upvotes: 0

Views: 84

Answers (2)

ssj
ssj

Reputation: 1797

if you call getElementById without any object,then you call window. getElementById, but you really should call document.getElementById. And you should import js file into html(in you local test). I have created another jsfiddle which is correct.

Upvotes: 2

kannan
kannan

Reputation: 711

var happyMood = document.getElementById("happy");
var sadMood = document.getElementById("sad");


happyMood.onclick = function () {
   var mainHeading =     document.getElementById("heading");
    mainHeading.innerHTML = "You have selected ";

};

sadMood.onclick = function () {
var mainHeading =    document.getElementById("heading");
    mainHeading.innerHTML = "You have selected " +   sadMood;
};

Upvotes: 0

Related Questions