html - Applying class change to all getElementsByTagName - Pure JavaScript -

html - Applying class change to all getElementsByTagName - Pure JavaScript -

i want utilize javascript only, not jquery.

i have 2 problems, firstly want correctly apply/remove class attribute each li element within ul

ideally when 1 li element has class set, remaining not have class attribute set(remove if set) - testing when need unset/remove class elements have been able set class class="", works isn't ideal.

i have been able scrape kid elements id's of ul getelementsbytagname

<ul id="u"> <li id='car' class="t">1</li> <li id='blue'>2</li> <li id='eight'>3</li> <li id='nasa'>4</li> </ul> var u = document.getelementbyid('u'); var li = u.getelementsbytagname('li');

my sec problem looping on li seems give me alot of excessive rubbish.

for (var in li) { alert(li[i]["id"]); } //returns auto bluish 8 nasa undefined undefined undefined

what best way this?

because that's how iterate on object, not array.

the standard loop homecoming results expected:

for (var = 0; < li.length; i++) { alert(li[i]["id"]); }

to remove classes them, utilize within loop:

li[i].classname = "";

to remove specific class:

li[i].classlist.remove("classnamehere");

if want remove whole element attribute (not reset classes), use:

li[i].removeattribute("class");

see 3 examples in action here: http://jsfiddle.net/vr9mm2vk/1/

javascript html