Closable Windows

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<button id="new-window">New Window</button>
<div class="window-container">
  
</div>

CSS

body {
  font: 14px Helvetica, Arial, san-serif;
}

.window {
  height: 60px;
  width: 100px;
  color: white;
}

.window:nth-child(3n+1) {
  background: red;
}

.window:nth-child(3n+2) {
  background: blue;
}

.window:nth-child(3n+3) {
  background: green;
}

.window .close {
  background: black;
  width: 10px;
  height: 10px;
  color: white;
  font-size: 10px;
}

.window-container {
  background: white;
  width: 100vw;
  height: 90vh;
  position: absolute;
  top: 10vh;
  left: 0;
}

JavaScript

(function($){
  function makeResponseBox() {
    $close = $('<div>').addClass('close').html('x');
    $window = $('<div>').addClass('window').html($('.window').length);
    $close.on('click', function(e){
      e.preventDefault();
      $(e.target).closest('.window').remove();
      return false;
    });
    $window.append($close);
    return $window;
  }

  $('#new-window').on('click', function(){
  	$window1 = makeResponseBox();
    $('.window-container').append($window1);
  });
})(jQuery);