Showing and hiding elements - Best way to organize the divs

Showing and hiding elements - Best way to organize the divs

Hello,

I always try to show or hide elements and would like if there is a different way to organize numerous div.

ie:
<div class="main-div"><div id="element1></div><div id="element2></div><div id="element3></div></div>


             $("#element1").show();
             $("#element2").show();
             $("#element3").show();
  

Is there a way to add all of them into 1 class and instead show or hide each element of the class based on an ajax response data. ie:
             $(".element1").html(data.delivery_charge).show();
             $(".element2").html(data.recalculated_vat).show();
             $(".element3").html(data.recalculated_total).show();

Would this be ok?
<div class="main-div"><div class ="element1 element2 element3></div></div>

I am just trying to find a way to shrink the amount of code.

Please let me know if the above would be a standard way to show/hide responses rather than having a lot of different divs with ids.

Thank you