[javascript] Add Class to Object on Page Load

Basically I want to make this:

<li id="about"><a href="#">About</a>

Into this when the page loads:

<li id="about" class="expand"><a href="#">About</a>

I found this thread, but am not so good with javascript and couldn't adapt it: Javascript: Onload if checkbox is checked, change li class

This question is related to javascript onload

The answer is


This should work:

window.onload = function() {
  document.getElementById('about').className = 'expand';
};

Or if you're using jQuery:

$(function() {
  $('#about').addClass('expand');
});

I would recommend using jQuery with this function:

$(document).ready(function(){
 $('#about').addClass('expand');
});

This will add the expand class to an element with id of about when the dom is ready on page load.