How to update an element using .textContent

Question

I want to use a script using JavaScript that updates an element in the footer of a website. However, the h3 element isn't getting updated.

I have tried textContent not updating HTML, but I wasn't able to find my solution there.

Here is my CodePen: https://codepen.io/martinlutherwinn/pen/NWPvRpZ

This is my current code:

<div class="Footer">
    <h3></h3>
</div>

var copyrightedYear = (function() {
    var header = document.getElementsByClassName("Footer")[0].textContent;
    var currentDate = new Date();
    var currentYear = currentDate.getFullYear();
    var msg = "@" + currentYear + " Haitian Educators of Palm Beach.";
    header = msg;
}());

Here's a fixed version: https://codepen.io/khrismuc/pen/mdyMrMz?editors=1010 — , Dec 27 '19 at 19:58

Anonymous · Accepted Answer · 2019-12-27T20:00:42.977

You're setting a new value for header, which is a copy of the text in the element. You need to assign to the property to change the text:

var copyrightedYear = (function() {
    var header = document.getElementsByClassName("Footer")[0];
    var currentDate = new Date();
    var currentYear = currentDate.getFullYear();
    var msg = "@" + currentYear + " Haitian Educators of Palm Beach.";
    header.textContent = msg;
}());

Also copyrightedYear will be undefined unless you have return msg.

How to update an element using .textContent

1 Answers1