0

Help in JavaScript

In this code, I want a button to first display some content on clicking and then on clicking again, it should hide that content. Please guide me how to do it. https://code.sololearn.com/W0a19a0a2135

17th Mar 2021, 4:54 PM
Sarthak Gour
Sarthak Gour - avatar
5 Answers
+ 1
function viewContent() { var c = document.getElementById("content"); var h = document.getElementById("heading"); if (c.style.display) { c.style.display = ""; h.textContent = "Click to view more content"; } else { c.style.display = "block"; h.textContent = "Click to hide content"; } }
17th Mar 2021, 5:02 PM
visph
visph - avatar
0
visph can you please explain if(c.style.display) and c.style.display = "";
17th Mar 2021, 5:10 PM
Sarthak Gour
Sarthak Gour - avatar
0
c.style.display = "" reset the display value if (c.style.display) is true if display == "block"
17th Mar 2021, 5:11 PM
visph
visph - avatar
0
visph how can I add a different css to 'Click to hide content'
22nd Mar 2021, 10:43 AM
Sarthak Gour
Sarthak Gour - avatar
0
either by adding className / modifying classList properties (related to element class attribute), or by using style property (as you do with 'c' (content element id) for changing 'display' css rule... through style property you should use camelcase css properties while in css you should use kebabcase (ie: background-color should becomes backgroundColor)... as dash is not valid in javascript identifiers...
22nd Mar 2021, 10:49 AM
visph
visph - avatar