JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.min.css">
<div class="medica_rpt cloned-row4" >
  <div class="row">
    <div class="col-xs-4 col-sm-3 col-md-3 col-lg-3">
      &nbsp;
    </div>
    <div class="col-xs-2 col-sm-1 col-md-2 col-lg-2 ctm_lft_mrpt">
      <label class="lbl_accep">Accepted ?</label>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <label class="lbl_accep">Accepted by</label>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <label class="lbl_accep">Accepted on</label>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <label class="lbl_accepft">Document Remarks</label>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-4 col-sm-3 col-md-3 col-lg-3">
      <div class="custom-file-input" id="custom-file-input">
        <input type="file" class="check">
        <input type="text" class="txt_field ctm_widt check" id="file_name" disabled placeholder="Attached File">
        <button class="cst_select ">
          <i class="fa  fa-rotate-90">
          </i> Attach
        </button>
      </div>
      <a href="#" target="_blank" class="preview">View</a>
    </div>
    <div class="col-xs-2 col-sm-1 col-md-2 col-lg-2 ctm_lft_mrpt">
      <input type="checkbox">
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <input type="text" class="smipt_Field" id="accpt_by" name="accpt_by" disabled/>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <input type="text" class="smipt_Field" id="accpt_on" name="accpt_on" disabled/>
    </div>
    <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ctm_lft_mrpt">
      <select class="slt_Field" id="txt_dcmRem" name="txt_dcmRem">
        <option value="" selected='selected'>&nbsp; </option>
        <option value="COLR">Coloured Copy Required</option>
        <option...

CSS

.smipt_Field {
    border: 1px solid #aeaeae;
    width: 120px;
    padding: 4px;
}    
.ctm_lft_mrpt{
    margin-left:20px;
}
.custom-file-input{
    display: inline-block;
    overflow: hidden;
    position: relative;
    padding-top: 0px;
}
.custom-file-input input[type="file"] {
    height: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 29%;
    z-index: 999;
}
.cst_select{
    color: white;
    background-color: #D3832C;
    border-bottom:2px solid #000;
    width: 91px;
    height: 25px;
    border-left:0px;
    border-right:0px;
    border-top:0px;
    margin-left:20px;
}
.btn_more{
    background: transparent url(http://s9.postimg.org/fc95t36gb/btn_more.jpg);
    width:91px;
    height:27px;
};
.btn_less{
    background: transparent url(http://s9.postimg.org/qnbthgdbf/btn_less.jpg);
    width:91px;
    height:27px;
};

JavaScript

$(document).ready(function (){	//dynamic row for Attachment Table
  
  addActions( $('.cloned-row4:eq(0)') );
  
  var count=0;
  $(document).on("click", ".attch_add_button", function () {
    var $clone = $('.cloned-row4:eq(0)').clone();
    //$(".custom-file-input").closest('form').trigger('reset');
    //$(".custom-file-input").replaceWith('.check'.val('').clone(true));
    //alert("Clone number" + clone);
    $clone.find('[id]').each(function(){this.id+=''});
    $clone.find('.btn_more').after("<input type='button' class='btn_right btn_less1' id='buttonless'/>")
    $clone.attr('id', "added"+(++count));
    //$clone.find('#custom-file-input').val('');
    $clone.find('.preview').hide();
    $clone.wrap('<form>');
    $clone.closest('form').trigger('reset');
    $clone.unwrap();

    //$clone.find('input[type=file]').val('');

    //$clone.find('.pn_field').val("");
    $(this).parents('.medica_rpt').after($clone);
    
    addActions($clone);
    
  });

  $(document).on('click', ".btn_less", function (){
    var len = $('.cloned-row4').length;
    if(len>1){
      $(this).closest(".btn_less").parent().parent().parent().remove();
    }
  });
  
  function addActions(container){
  
    var $preview = container.find(".preview");
    //var $acceptdiv = $("#accept_div");
    //$acceptdiv.hide();
    $preview.hide();
    
    container.find(".check").on("change", function(){
      alert("alert");
      var filename = this.value;
      var files = this.files;
      var URL = window.URL||window.webkitURL;
      var url = URL.createObjectURL(files[0]);
      $preview.attr("href", url);
      $preview.show();
      //$acceptdiv.show();
      container.find("#file_name").val(filename).prop("disabled", true);
    });
  
  }
  
});