Hide div and open another div when i click on the image

I have an image gallery and inside each image I have a div with the image name. When I click on an image a modal with some details is opened and the div with the image name is changed by the div with the tools.

What I want is that when closing the modal (just click outside it) everything returns to the original phase ie the div with the name replaces the div with the tools.

My codepen --- see my code

Original state

Status when I click on the image

Here the modal is opened and the div with the image name is replaced by the div of the tools.

Problem

When I close the modal, the tools div is visible, I want it to be the original div that contains the name.

html

<div class="container first">
  <div class="row text-center text-lg-left tab-pane" data-toggle="modal" data-target="#myModal2">
    <div class="col-sm-2">
      <a class="d-block mb-4 h-100">
        <img class="Images" src="https://source.unsplash.com/aob0ukAYfuI/400x300" alt="">
        <div class="ImageText"> Name</div>         
      </a>
    </div>
    <div class="col-sm-2">
      <a class="d-block mb-4 h-100">
        <img class="Images" src="https://source.unsplash.com/EUfxH-pze7s/400x300" alt="">
        <div class="ImageText"> Name</div>
      </a>
    </div>
    <div class="col-sm-2">
      <a class="d-block mb-4 h-100">
        <img class="Images" src="https://source.unsplash.com/M185_qYH8vg/400x300" alt="">
        <div class="ImageText"> Name</div>
      </a>
    </div>
    <div class="col-sm-2">
      <a class="d-block mb-4 h-100">
        <img class="Images" src="https://source.unsplash.com/sesveuG_rNo/400x300" alt="">
        <div class="ImageText"> Name</div>
      </a>
    </div>
    <div class="col-sm-2">
      <a class="d-block mb-4 h-100">
        <img class="Images" src="https://source.unsplash.com/AvhMzHwiE_0/400x300" alt="">
        <div class="ImageText"> Name</div>
      </a>
    </div>


    <div class="ImageButtonsG">
    <a>
      <img src="https://cdn0.iconfinder.com/data/icons/typicons-2/24/home-128.png" class="Pin">
    </a>

    <a>
        <img src="https://cdn1.iconfinder.com/data/icons/hawcons/32/698627-icon-111-search-128.png" class="Chat">
      </a>

    <a>
      <img src="https://cdn2.iconfinder.com/data/icons/freecns-cumulus/16/519584-081_Pen-128.png" class="Task">
    </a>

    <a>
      <img src="https://cdn0.iconfinder.com/data/icons/small-n-flat/24/678093-pin-128.png" class="Inbox">
    </a>     
    </div>
  </div>
</div>


<div class="container demo">
  <div class="modal right fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <div class="modal-title">
            <h4>Specs</h4>
          </div>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
        </div>
        <div class="modal-body">
          <div class="card card1">
            <div class="card-body">
              <div class="form-row">
                <div class="form-group col-md-6">
                  <label class="Title">Title</label>
                </div>
                <div class="form-group col-md-6">
                  <label class="Title">Ref</label>
                </div>
              </div>
              <div class="form-row">
                <div class="form-group col-md-6">
                  <label class="">tittle</label>
                </div>
                <div class="form-group col-md-6">
                  <label class="">reference</label>
                </div>
              </div>                
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Javascript

$(document).ready(function() {
  var toolbar = $('.ImageButtonsG').html();
  $(".d-block").each(function (index, value) {
    $(this).on("click", function(){
      var default_title = $(this).find('.ImageText');
      $(default_title).html(toolbar);
      $('.ImageButtonsG').empty();
    });
  });
});