Bootstrap toggle UI - JS Collapse

Question

<p data-toggle="collapse" data-target="#trans" class="toggle-transaction">Latest Transactions <i class="fa fa-chevron-up"></i></p>

<div id="trans" class="collapse">
   <div class="row">
      <div class="col-sm-7 col-xs-7">
         <div class="p-card-info">
            <div class="names-align">$ 7,816</div>
            <div class="rm-type">Nov 07, 2018</div>
         </div>
      </div>
      <div class="col-sm-5 col-xs-5">
         <div class="p-card-info info">
            <div class="names-align">Pending </div>
            <div class="rm-type-align">MH0070</div>
         </div>
      </div>
   </div>
   <div class="hr-market"></div>
</div>

<style>
   .collapse {
        display: none;
    }
</style>