How to apply CSS style to all elements with same ID using one button?

Question

My idea was to create a button to hide/show all hidden text (Hide by highlighting the text in black, show by making the background color of the text transparent). But the codes,

Answer 1

As others have said, do not use the same id more than once on a single page. Instead, use a class name or data attributes. And since you marked your question with jQuery:

function change()
{
    var test = document.getElementById("button1");
    if (test.value=="Hide Spoiler") 
    {
        test.value = "Open Spoiler"; 
        $('.className').css('background-color','transparent');
    }
    else 
    {
        test.value = "Hide Spoiler"; 
        $('.className').css('background-color','transparent');
        $('.className').css('color','black');
    }
}

If you're going to use jQuery, I'd also recommend using the button's click event like such:

$('#button1').click(function() {
  ...
});