CODEWITHSUNDEEP
javascript
cgeekmt
cgeekmt

Reputation: 63

Javascript change innerhtml of a tag

I am trying to change the text of the innerhtml depending on the current value. However, it isn't going in the if statements.

//HTML

<a class="btn" value="notadded" onclick="changetext(this.id,this.value)" id="wishlist">Add to wish list<i class="fa fa-heart-o"></i></a>

//Script

<script>function changetext(id,value) {
      if ( value == "notadded") {
        document.getElementById(id).innerHTML = "Added to Wishlist";
        document.getElementById(id).value = "added";
      } else if (value == "added")
      {
          document.getElementById(id).innerHTML= "Add to Wishlist";
          document.getElementById(id).value = "notadded";
      }
}
</script>

Upvotes: 0

Views: 1327

Answers (2)

omarjmh
omarjmh

Reputation: 13888

This issue here is that you cannot use value to get the text on that tag.

You're right there, only one small change:

Working Demo: JsFiddle

<a class="btn" value="notadded" onclick="changetext(this.id,this.value)" id="wishlist">Add to wish list<i class="fa fa-heart-o"></i></a>


<script>function changetext(id,value) {

        document.getElementById(id).innerHTML = "Added to Wishlist";
        document.getElementById(id).innerHTML = value;

}
changetext("wishlist");
</script>

Upvotes: 2

Joel Holmes
Joel Holmes

Reputation: 1053

Anchor tags do not have a value attribute

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a

However you could use a data attribute to do what you are doing.

Upvotes: 1

Related Questions