CODEWITHSUNDEEP
javascripttoggle
Hyewon Joo
Hyewon Joo

Reputation: 13

Javascript icon toggle using else-if

I would like to make bookmark and it has to be coded with Javascript and else-if. Could you please help with this issue? 

    var iBookmark = document.createElement('I');
    iBookmark.setAttribute('id', 'bookmark' + ecgData.id);
    iBookmark.setAttribute('class', 'bookmark outline icon');
    iBookmark.setAttribute('value', 'bk-false');
    iBookmark.style.color = 'white';

      if (checkedID.className = 'bookmark outline icon') {
        checkedID.setAttribute('class', 'bookmark icon');
        console.log(true);
      } else {
        checkedID.setAttribute('class', 'bookmark outline icon');
        console.log(false);
      }

      if (checkedID.getAttribute('value', 'bk-false')) {
        checkedID.setAttribute('class', 'bookmark icon');
        checkedID.setAttribute('value', 'bk-true');
        console.log('true')
      } 

      else if (checkedID.getAttribute('value', 'bk-true')) {
        checkedID.setAttribute('class', 'bookmark outline icon');
        checkedID.setAttribute('value', 'bk-false');
        console.log('false')
      }

When I click it, it changes to true and stays there, and it doesn't change back to false when I keep clicking it. It stays with true from default false.

Upvotes: 0

Views: 49

Answers (1)

skapicic
skapicic

Reputation: 211

The line if (checkedID.className = 'bookmark outline icon') { is missing its second = and isn't evaluating the expression, it is assigning the value to the class name. Fix by changing it to if (checkedID.className == 'bookmark outline icon') {

Upvotes: 1

Related Questions