TypeError: document.getElementById(...) is null

In the javascript console I get this error:

TypeError: document.getElementById(...) is null

How do I have to change this code to fix it? I think I have to do a NULL check but not sure how to do it.

  function computeTotalDistance(result) {
    var total = 0;
    var myroute = result.routes[0];
    for (i = 0; i < myroute.legs.length; i++) {
      total += myroute.legs[i].distance.value;
    total = total / 1000.
    document.getElementById("total").innerHTML = total + " km";

Open in new window

Who is Participating?

Improve company productivity with a Business Account.Sign Up

Tom BeckConnect With a Mentor Commented:
You could check for null and undefined...
var ele = document.getElementById("total");
  if(typeof ele !== 'undefined' && ele !== null) {
    document.getElementById("total").innerHTML = total + " km";

Open in new window

...but if you know for sure that an element with that id is on the page, the more likely possibility for the error is that you are looking for the element before it exists on the page. For example, if your computeTotalDistance function is called from other code in the head section that runs automatically on window load.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.