How to remove div on click?

Question

I have a problem because i add html through jquery. So when i click on remove button i dont get alert. Any suggestion how can i fix that?

$(document).ready(function() {
  var max_fields      = 10; //maximum input boxes allowed
  var wrapper         = $(".input_filelds_main_wrapp"); //Fields wrapper
  var add_button      = $("#addNewIframe"); //Add button ID

  var x = 1; //initlal text box count
  $(add_button).click(function(e){ //on add input button click
      e.preventDefault();
          html = '<hr class="gray_line" />';
          html += '<div class="input_fields_wrap"><div class="form-group">';
          html += '<label class="form_title">TITLE <a href="#" class="remove_field"><i class="fa fa-times"></i></a></label>';
          html += '<input type="text" name="iframe_title[]" class="form_input iframe_title" />';
          html += '</div>';
          html += '<div class="form-group">';
          html += '<label class="form_title">IFRAME</label>';
          html += '<textarea name="view360[]" class="description_property view360s"></textarea>';
          html += '</div></div>';
          html += '<input type="hidden" class="view360_id" value="undefined" />'
          $(wrapper).append(html);
  });

  $('.remove_field').click(function(e){ //user click on remove text
      alert('aaaa');
      e.preventDefault();
      e.preventDefault(); $(this).parent('div').remove(); x--;
  })
});