How to implement if else statement in a jquery click event function?

How to implement if else statement in a jquery click event function?

I had searched a code in jquery that will access a div element inside the td element of the table that when a button is click. Below is my code to open the div element which is inside the td element of the table when the input button is clicked and it got working. However, I need to implement the if else statement inside that jquery code so that I can close back the div element when the button is click again. So, how can I implement this if else statement using these code below?

jQuery:

  1.  $(function () {
  2.             $('.Reply').click(function () {
  3.                 $(this).closest('p').next('.divrep').show();
  4.                
  5.             });

HTML:

  1. <table id="mytable">  
  2.       
  3.      
  4.     @foreach (var item in Model.Comments )
  5.       {
  6.     <tr >
  7.         <td class="tdstyle" >
  8.        
  9.   <div style="font-weight:bold;">  @Html.DisplayFor(modelItem => item.name) </div> 
  10.        
  11.   <p class="minimize" style ="white-space: pre-line; margin-top:0px;margin-bottom:0px; border-radius: 4px 4px 4px 4px; max-width :500px; min-height :5px;  display :block; background-color: #CCCCFF">  @Html.DisplayFor(modelItem => item.comment) </p>
  12.   <p style="margin-top:2px;margin-bottom:0px"> <input type="button" id="like" name="like" value="Like" style="color:blue;border:0px;background-color:inherit;cursor:pointer" /> <input type="button" class ="Reply" name="Reply" value="Replie(s)"   style="margin-bottom:0px;color:blue;border:0px;background-color:inherit;cursor:pointer" /></p>
  13.                   
  14.    <div class ="divrep" style="display:none; position:relative;left:50px; overflow:auto;margin-top:0px;margin-bottom:0px">
  15.            <table>
  16.              @foreach (var item2 in Model.Replies.Where(r => r.idrep == item.Id))
  17.               {
  18.                  <tr >
  19.                    
  20.                      <td >
  21.                          <div style="font-weight:bold;"> @Html.DisplayFor(modelItem => item2.namerep) </div> 
  22.                         
  23.                      <p class="minimize" style ="margin-top:0px;margin-bottom:0px;white-space:pre-line; border-radius: 4px 4px 4px 4px; max-width :445px; min-height :5px;  display :block; background-color: #CCCCFF;">@Html.DisplayFor(modelItem=>item2.reply)  </p>
  24.                                                                         
  25.                    </td>
  26.                  </tr>
  27.               } 
  28.             </table>      
  29.         
  30.      @using (Html.BeginForm("PostComment", "Profile", FormMethod.Post, new { }))
  31.        {
  32.          <div class="editor-field" style="display:none; margin-bottom:5px;margin-top:5px">
  33.         <input type="text" id="comidvalue" name="idrep" value="@Html.DisplayFor(modelItem=>item.Id)" />
  34.          <span class="field-validation-valid" data-valmsg-for="idrep" data-valmsg-replace="true"></span>
  35.         </div>
  36.       <br />
  37.            <input type="text" id="namerep" name="namerep" />
  38.        <span class="field-validation-valid" data-valmsg-for="namerep" data-valmsg-replace="true"></span>
  39.                          <br />
  40.               <textarea id="reply" name="reply" style="width:445px;height:100px;resize:none" ></textarea>
  41.       <span class="field-validation-valid" data-valmsg-for="reply" data-valmsg-replace="true"></span>
  42.    
  43.            <input type="submit" value="Post Reply" name="butname" />
  44.         
  45.        }
  46.             <br />
  47.      </div>
  48.              
  49.         </td>       
  50.     </tr>
  51.     
  52.       }

  54.       
  55. </table>