EDit and Remove elements in DOM

kanaklatwal · kanaklatwal · commit 140310b9c169 · 2026-01-29T05:44:55.000Z
diff --git a/06_DOM/four.html b/06_DOM/four.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Chai aur code | DOM</title>
+</head>
+<body style="background-color: #212121; color: aliceblue;">
+    <ul class= "language">
+        <li>Javascript</li>
+    </ul>
+</body>
+<script>
+    function addLanguage(langNAme){
+        const li = document.createElement('li')
+        li.innerHTML = `${langNAme}`
+        document.querySelector('.language').appendChild(li)
+    }
+    addLanguage("python");
+    addLanguage("typeScript");
+
+    function addOptiLanguage(langNAme){
+        const li = document.createElement('li');
+        li.appendChild(document.createTextNode(langNAme));
+        document.querySelector('.language').appendChild(li);
+    }
+    addOptiLanguage('golang');
+
+    //EDIT
+    const secondLang = document.querySelector("li:nth-child(2)")
+    console.log(secondLang);
+    //secondLang.innerHTML = "MOJo"
+    const newli = document.createElement('li')
+    newli.textContent = "Mojo"
+    secondLang.replaceWith(newli);
+
+    //edit
+    const firstLang = document.querySelector("li:first-child")
+    firstLang.outerHtml = '<li>TypeScript</li>'
+
+    //remove
+    const lastLang = document.querySelector('li:last-child')
+    lastLang.remove()
+</script>
+</html>
