Jquery Foreach After Clicking Button

Question

My site generates html code with php and I need to toggle a section to show after clicking a button. Problem is with this code, after clicking, only reveals one item.

$("body").on('click','.btn',(function(){
document.querySelector(".hide").style.display = "block";

});

I need it to iterate over each .hide

Answer 1

document.querySelectorAll(".hide").forEach( hide => {
  hide.style.display = "block";
})

Answer 2

Seems like this makes more sense. Just remove the hide class?

$("body").on('click', '.btn', (function() {
      $(".hide").removeClass('hide');
    });

Answer 3

Just keep using jQuery, specifically the .show() method

Display the matched elements

$(document.body).on("click", ".btn", () => {
  $(".hide").show()
})