jquery insertAfter for ie8

Question

        var attachmentDeleteMainModal = $('#attachment-deletion');
        var attachmentDeleteMainModalClone = attachmentDeleteMainModal.clone();
        attachmentDeleteMainModalClone.attr('id', 'attachment-deletion-'+'main');
        attachmentDeleteMainModalClone.insertAfter('#attachment-deletion');

This method adds my new selector to the DOM in Chrome, but does not work in ie8, this is all I tested so far

append instead of insertAfter does not create the desired selector in either browser. But in ie8 it does not create anything at all

what is the solution to this? any insight appreciated

Answer 1

You could try with

 $('#attachment-deletion').after(attachmentDeleteMainModalClone);

Answer 2

In IE8 I had an exception in $rows.insertAfter($(elem)) line, so I fixed it with this solution:

            var $rows = $("tr", $(parsedXML));
            try {
                $rows.insertAfter($(elem));
            } catch (error) {
                // we got <table><tbody><tr... from the server and need to paste only all <tr> from it after our tr in $(elem)
                var divData = $("table", $(parsedXML));
                var divTmp = document.createElement("div");
                divTmp.innerHTML = divData[0].xml;
                var children = divTmp.firstChild.firstChild;
                var fragment = document.createDocumentFragment();
                var current = children.firstChild;

                while (current) {
                    fragment.appendChild(current.cloneNode(true));
                    current = current.nextSibling;
                }

                elem.parentNode.insertBefore(fragment, elem.nextSibling);
            }

Sorry, it is not so clean with ".firstChild.firstChild", but worked for me. We got <table><tbody><tr... from the server and need to paste only all <tr> from it after our tr in $(elem)