JSFiddle - React, Tailwind, and code Playground

HTML

<dl class="dl">
    <dt><b>Name:</b></dt>
        <dd>My name</dd>   
    <dt><b>Department</b></dt>
        <dd>My department</dd>  
    <dt><b>Email</b></dt>
        <dd>My Email</dd>
</dl>

<br/>

<dl class="dl">
    <dt>Name:</dt>
        <dd>My name</dd>   
    <dt>Department</dt>
        <dd>My department</dd>  
    <dt>Email</dt>
        <dd>My Email</dd>
</dl>

<br/>
<dl class="dl">
    <dt>Name:</dt>
        <dd>My name</dd>   
    <dt>Department</dt>
        <dd>My department</dd>  
    <dt>Email</dt>
        <dd>My Email</dd>
</dl>

JavaScript

$(function(){
   $(".dl").each(function(){
     var $dd = $(this).nextUntil("dt"), $this;
     $dd.filter(":gt(0)").hide();
     
     
     if($dd.length > 1){  
         $dd.last().after($("<a href='#'>View More</a>").click(function(e){
              e.preventDefault();
              $(this).text($(this).text() == "View More"?"Hide More":"View More")
              .prevAll("dt:first").nextUntil("dt").filter(":gt(2):not('a')").toggle()
         }));
     }
   });
});