Почему не работает модификация DOM в XHTML?
При создании элементов (и атрибутов) в пространствах имён (это то, что указано в атрибуте xmlns) требуется вызов createElementNS с указанием этого самого пространстваvar test = document.createElementNS('http://www.w3.org/1999/xhtml', 'i');
Технически, можно и не указывать пространство, но тогда все элементы будут относиться к тому пространству, в котором расположен глобальный контекст (это если вы решите динамически inline SVG модифицировать).
Напишите маленькую функцию (или прототип jQuery расширьте). Можете сделать её и немаленькой — с парсингом строки для выделения имени тэга и атрибутов.$.extend($, {
	createNS: function (tag, ns) {
		return $(document.createElementNS(ns, tag));
	}
});

$(function () {
	$.createNS('i', 'http://www.w3.org/1999/xhtml')
		.text('added tag')
		.appendTo($('#parent'));
});Update: причину глюка верно указал @SelenIT2 — заключите в CDATA свой скрипт. И вообще следуйте требованиям синтаксиса и структуры XML.
Тем не менее, вопрос о пространстве имён имеет значение при генерации элементов и атрибутов из пространства, отличающего от того, в котором находится глобальный контент (SVG, RDFa и т.п.).
используйте document.body.addEventListener("DOMContentLoaded",()=>{
   let el=document.createElement("I");
   el.innerHTML="addedTag";
   document.getElementById("parent").appendChild(el);
},false);
и script внутри body
и<!DOCTYPE html>