CODEWITHSUNDEEP
javascriptjquery
CogentP
CogentP

Reputation: 259

Changing name of all classes in html document with javascript

I have a List that shows Products. When I click on one, I need to change the class of the <li> so as to show that it is clicked. I got this working... But what I can't do is clear the other <li> that have been previously clicked so as to show it is not selected anymore.

This is part of my code, what am I doing wrong? btw, my logic here is to first refresh all classes to notselected, and then just update the list with my product id number. this can be seen on the second line of code.

I'm new to javascript, and did my research, and this is what I got.

function showdetails(ProductID) {           
  document.getElementsByName("ProductList").className = "notselected";
  $("#"+ProductID).attr('class','selected');

Upvotes: 0

Views: 64

Answers (2)

lxe
lxe

Reputation: 7599

I think you need to iterate across all elements returned in document.getElementsByName("ProductList") and change className to each element individually.

var productLists = document.getElementsByName('ProductList');
for (i = 0; i < productLists.length; i++) {
  productLists[i].className = 'notselected'
}

Upvotes: 0

h2ooooooo
h2ooooooo

Reputation: 39540

Are you trying to do this?

function showdetails(ProductID) {    
    $("[name=ProductList].selected").removeClass('selected');
    $("#"+ProductID).addClass('selected');
}

Upvotes: 3

Related Questions