Change value of class attribute in html using jquery or javascript

Question

I want to change this line:

    <li id="activehome" ><a href="#" >Home</a></li>

to

    <li id="activehome" class="active"><a href="#" >Home</a></li>

Adding that class attribute. How do I do this using Javascript or even Jquery will do. Thanks in advance. The line should be changed when the page loads.

Show what did you try so far and others will help you to fix it. — David Ferenczy Rogožan
– David Ferenczy Rogožan, Commented Sep 6, 2015 at 5:06
Have you tired anything or simply asking your question without trying anything ? show what you tired — Srinu Chinka
– Srinu Chinka, Commented Sep 6, 2015 at 5:19

torvin · Accepted Answer · 2015-09-06 04:58:02Z

1

jQuery, using addClass:

$('#activehome').addClass('active');

pure JS, using setAttribute:

document.getElementById('activehome').setAttribute('class', 'active');

or using className

document.getElementById('activehome').className = 'active';

answered Sep 6, 2015 at 4:58

torvin

7,3394 gold badges39 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Mohammad Rayan Over a year ago

I have tried this. It doesn't work. The idea behing it is I have a navigation bar which I call in different pages. So I have put the code for navigation bar in a file nav.php and called it using include in my index.php. I want to use JS or JQuery to change the Home button to active or for any button on any page where I call this nav bar. If there is a better solution please suggest me that.

mplungjan Over a year ago

Yes it works according to the information you have given. Please update your question with enough information for us to answer this for your situation - My assumption is you have multiple IDs with activehome

torvin Over a year ago

What do you mean by 'doesn't work'? You need to be more specific.

Mohammad Rayan Over a year ago

Hey sorry! It worked after I wrote it inside onload. Thank you :)

Mxx persian · Accepted Answer · 2015-09-06 04:59:08Z

0

$("#activehome").addClass('active'); $("#activehome > a").text('Home');

answered Sep 6, 2015 at 4:59

Mxx persian

1054 bronze badges

Collectives™ on Stack Overflow

Change value of class attribute in html using jquery or javascript

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related