// Text nodes can be made using the "write" method
document.write('foo');
// Elements can be made too. First, they have to be created in the DOM
const myElem = document.createElement('span');
// Attributes like classes and the id can be set as well
myElem.classList.add('foo');
myElem.id = 'bar';
// For here, the attribute will look like this: <span data-attr="baz"></span>
myElem.setAttribute('data-atrr', 'baz');
// Finally append it as a child element to the <body> in the HTML
document.body.appendChild(myElem);
// Elements can be imperitavely grabbed with querySelector for one element, or querySelectorAll for multiple elements that can be loopped with forEach
document.querySelector('.class');
document.querySelector('#id');
document.querySelector('[data-other]');
document.querySelectorAll('.multiple');