//Pretend there is a <p> with class "example"
const myParagraph = document.querySelector('.example');
//You can do many this with is
myParagraph.textContent = 'This is my new text';// TO select all the h1 from Html
document.querySelectorAll("h1")
//To select h1 from a particular class or id
document.querySelector(".className/#id h1")var el = document.querySelector(".myclass");<div id="foo\bar"></div>
<div id="foo:bar"></div>
<script>
console.log('#foo\bar'); // "#fooar" (\b is the backspace control character)
document.querySelector('#foo\bar'); // Does not match anything
console.log('#foo\\bar'); // "#foo\bar"
console.log('#foo\\\\bar'); // "#foo\\bar"
document.querySelector('#foo\\\\bar'); // Match the first div
document.querySelector('#foo:bar'); // Does not match anything
document.querySelector('#foo\\:bar'); // Match the second div
</script>document.querySelector('html').onclick = function() {};// Select the first <div>
const firstDiv = document.querySelector('div');
// Select the first .button element inside .main-navigation
const navMenu = document.getElementById('main-navigation');
const firstButtonChild = navMenu.querySelector('.button');