There are several benefits to creating your own custom tabs on your website:

Organization: Custom tabs allow you to organize and present your content in a clear and visually appealing manner. This can make your website easier to navigate and improve the user experience.

Customization: By creating your own custom tabs, you have the freedom to customize the appearance and functionality of the tabs to match your website’s design and meet your specific needs.

Enhance functionality: Custom tabs can be used to add additional functionality to your website, such as contact forms, FAQ sections, and more.

Improve SEO: Custom tabs can help improve your website’s search engine optimization by allowing you to add more content to your pages without overwhelming the user.

Overall, creating your own custom tabs can help make your website more organized, customizable, functional, and user-friendly.

 .hide{
    display:none;
  }
   .arrow::after{
    content:"2";
    position: absolute; 
    right: 0; 
    top: 30%; 
    font-family:ETModules;
    font-size: 30px; 
    text-shadow: 1px 1px 10px #61c670;   
    color: #000;
    cursor:pointer;  
    -webkit-transition:0.3s;  
    -o-transition:0.3s;  
    transition:0.3s;
  }  
  .rotate::after {
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transition:0.3s;
    -o-transition:0.3s;
    transition:0.3s;
	}
  .active{
    background: rgb(242 242 242);
    border-radius: 30px;
    border: 1px dotted #959595;
    padding:6px;
  }

(function ($) {
  $(document).ready(function ($) {
    $("#jtrigger-1").addClass("rotate");

    $("[id^=jtrigger]").click(function () {
      jhideAll();
      let jid = $(this).attr("id").replace("jtrigger-", "");
      $("#jcontent-" + jid).toggleClass("hide");
      $("#jsubtitle-" + jid).toggleClass("hide");
      $(this).addClass("rotate");
      $(this).addClass("active");
    });

    //hide all rows
    function jhideAll() {
      $("[id^=jcontent]").each(function () {
        $(this).addClass("hide");
      });
      $("[id^=jsubtitle]").each(function () {
        $(this).addClass("hide");
      });
      $("[id^=jtrigger]").each(function () {
        $(this).removeClass("rotate");
        $(this).removeClass("active");
      });
    }
  });
})(jQuery);