there are 3 buttons and when you click 3 of them showing the same content. I need to show unique content of buttons when you click on them seperately. how to make each button should show div's unique content?
function myFunction() {
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}span {
cursor:pointer;}<span onclick="myFunction()"class="total">button</span>
<div id="myDIV" style="display:none;" class="expandable">
content 1
</div>
<span onclick="myFunction()" class="total">button2</span>
<div id="myDIV" style="display:none;" class="expandable">
content 2
</div>
<span onclick="myFunction()" class="total">button3</span>
<div id="myDIV" style="display:none;" class="expandable">
content 3
</div>You gave the 3 divs the same ID , Which is not what you want ofcourse because the id is a unique selector for items .
From this point you can solve your problem
Regards
why you have same id for three buttons? I think you can update its content by different button id.