DEV Community

_Khojiakbar_
_Khojiakbar_

Posted on

1

Dynamic Element Creation

// Selects the container element using jQuery
const container = $('.container');

// Function to create a specified number of div elements
function createElement(num) {
    // Loop to create `num` number of div elements
    for (let i = 0; i < num; i++) {
        // Create a new div element
        const div = document.createElement('div');

        // Add classes to the div element for styling
        div.classList.add('p-5', 'bg-warning', 'm-3');

        // Set the inner HTML of the div element
        div.innerHTML = `<p>${i + 1}. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, aliquam!</p>`;

        // Append the div element to the container
        container.append(div);

        // Log the created div element to the console
        console.log(div);
    }
}

// Uncomment the following line to create 40 div elements
// createElement(40);

Enter fullscreen mode Exit fullscreen mode

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay