CODEWITHSUNDEEP
javascripthtml
Raunak Trikha
Raunak Trikha

Reputation: 52

Getting value as undefined in Javascript

I'm trying to manipulate value of a button in JS from HTML.

HTML Code:

<div onclick= "classToggle()" type="button" id="show-more">Show more</div>

The output I'm getting for elem is undefined.

JS Code:

function classToggle() {
    var elem = document.getElementById('show-more').value;
    alert(elem);
    if (elem.value == "Show more") elem.value = "Show less";
    else elem.value = "Show more"; }

Upvotes: 0

Views: 45

Answers (2)

Rusty Banks
Rusty Banks

Reputation: 25

Use innerHTML instead of value

function classToggle() {
    var elem = document.getElementById('show-more');
    alert(elem.innerHTML);
    if (elem.innerHTML == "Show more") elem.innerHTML= "Show less";
    else elem.innerHTML = "Show more"; }
<div onclick= "classToggle()" type="button" id="show-more">Show more</div>

Upvotes: 0

Majed Badawi
Majed Badawi

Reputation: 28434

You are trying to get the value of a div which is not possible. In order to get the text in it, you should be using innerHTML as follows:

function classToggle() {
     var elem = document.getElementById('show-more');
     alert(elem.innerHTML);
     if (elem.innerHTML == "Show more") 
          elem.innerHTML = "Show less";
     else 
          elem.innerHTML = "Show more"; 
}
<div onclick= "classToggle()" type="button" id="show-more">Show more</div>

Upvotes: 1

Related Questions