Remove rule's details modal dialog element after hiding

Elements inside modal dialog interfere with
the rest of the document (as they are just a partial
clone of the DOM, with same IDs etc.)

Author: evgenyz

xsl/xccdf-resources.xsl

@@ -1,7 +1,5 @@
 function openRuleDetailsDialog(rule_result_id)
 {
-    $("#detail-modal").remove();
-
     /*DO NOT remove the aria-hidden="false" attribute from the following lines!
     This attribute ensures that rule detail can be accessed by accessibility technologies such as screenreaders.*/
     var closebutton = $('<button type="button" class="close btn btn-sm btn-default" data-dismiss="modal" aria-hidden="false" title="Close">&#x274c;</button>');
@@ -16,6 +14,9 @@ function openRuleDetailsDialog(rule_result_id)
     closebutton.css( { "margin-top" : "-=23px" } );
     $("#detail-modal-body").append(clone);
 
+    $('#detail-modal').on('hidden.bs.modal', function (e) {
+        $("#detail-modal").remove();
+    })
     $("#detail-modal").modal();
 
     return false;