function vanish() {
document.getElementById("priceCheck").style.visibility = "hidden";
}
<body onload="vanish">
<div>
<input type="button" class="input_button" name="onestarbtn" value="One Star"/>
<input type="button" class="input_button" name="twostarbtn" value="Two Star"/>
<input type="button" class="input_button" name="threestarbtn" value="Three Star"/>
<input type="button" class="input_button" name="fourstarbtn" value="Four Star"/>
<input type="button" class="input_button" name="fivestarbtn" value="Five Star"/>
</div>
<div id="priceCheck">
test1
</div>
<div id="priceCheck">
test2
</div>
<div id="priceCheck">
test3
</div>
<div id="priceCheck">
test4
</div>
<div id="priceCheck">
test5
</div>
</body>
I want it to load all the tests with the "priceCheck" id's to be invisible on load. I then want to be able to click each of the input buttons, depending on the star(onestarbtn, twostar...) and corresponding with the test number, to make the priceCheck's visible. I have an idea but havn't quite gotten to that part. I, however, cannot seam to get the tests to vanish on load. Any help would be greatly appreciated.
Add style="display:none" to all of them and set style to block when you want to show it. The problem seems a bit too straight forward, so maybe i did not fully understand.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.