Convert code for profile status to DOM

Author: An0n3m0us

src/profile.ts

@@ -86,19 +86,28 @@ async function addUserInfo (uok: UsernameOrKaid): Promise<void> {
 					if (!data.hasOwnProperty("discussion_banned")) {
 						throw new Error("Error loading ban information.");
 					}else {
-						let bannedHTML = `<tr><td class="user-statistics-label">Banned</td>`;
+						const bannedTag = document.createElement("tr");
+						const bannedLabel = document.createElement("td");
+						bannedLabel.className = "user-statistics-label";
+						bannedLabel.textContent = "Banned";
+						bannedTag.appendChild(bannedLabel);
+
+						const bannedOutput = document.createElement("td");
 
 						if (data.discussion_banned === false) {
-							bannedHTML += `<td>No</td>`;
+							bannedOutput.textContent = "No";
+							bannedTag.appendChild(bannedTag);
 						}else if (data.discussion_banned === true) {
-							bannedHTML += `<td style="color: red">Discussion banned</td>`;
+							bannedOutput.style.color = "red";
+							bannedOutput.textContent = "Discussion banned";
+							bannedTag.appendChild(bannedTag);
 						}else {
 							throw new Error("Error loading ban information.");
 						}
 
 						const lastTR = table.querySelector("tr:last-of-type");
 						if (!lastTR) { throw new Error("Table has no tr"); }
-						lastTR.outerHTML = bannedHTML + `</tr>` + lastTR.outerHTML;
+						table.insertBefore(bannedTag, lastTR);
 					}
 				});
 			}

src/project.ts

@@ -105,23 +105,20 @@ function checkHiddenOrDeleted () {
 		if (response.status === 200) {
 			const PROGRAM_VIEW = `https://khan.github.io/live-editor/demos/simple/?scratchpad=${id}`;
 
-			msg.innerHTML = "This ";
-
 			const programTag = document.createElement("a");
 			programTag.className = "kae-white";
 			programTag.style.textDecoration = "none";
 			programTag.href = PROGRAM_VIEW;
 			programTag.innerText = "program";
-			msg.appendChild(programTag);
-
-			msg.innerHTML = msg.innerHTML + " is completely hidden. (";
-
 			const apiTag = document.createElement("a");
 			apiTag.className = "kae-white";
 			apiTag.href = API_URL + "?format=pretty";
 			apiTag.innerText = "API";
-			msg.appendChild(apiTag);
 
+			msg.innerHTML = "This ";
+			msg.appendChild(programTag);
+			msg.innerHTML = msg.innerHTML + " is completely hidden. (";
+			msg.appendChild(apiTag);
 			msg.innerHTML = msg.innerHTML + ")";
 		} else if (response.status === 404) {
 			msg.innerHTML = "This program is actually deleted.";