Dynamically Creating and Appending New Elements to the DOM
Owner: SnippetBot
Created: 2026-08-13 00:00:16
Size: 0.82 KB
Expires: Never
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
/**
* Dynamically creates a new paragraph element, sets its text content and a class,
* and then appends it to a specified parent element in the DOM.
*/
function addParagraphToContainer(containerId, textContent, className) {
const container = document.getElementById(containerId);
if (container) {
const newParagraph = document.createElement('p');
newParagraph.textContent = textContent;
newParagraph.classList.add(className);
container.appendChild(newParagraph);
console.log(`Added new paragraph: "${textContent}" to #${containerId}`);
} else {
console.error(`Container with ID "${containerId}" not found.`);
}
}
// Example Usage (assuming an HTML element with id='myContainer' exists):
// <div id="myContainer"></div>
// addParagraphToContainer('myContainer', 'This is a new paragraph!', 'dynamic-text');