document.querySelector

JavaScript can use CSS Selectors to reference an element on the page
The object you get represents an HTML element
You can access properties of the object to get information
You can overwrite some properties to make changes
You can call methods to get additional info

<div class="my-panel">
    <header>Panel Title</header>
</div>

const myPanelHeader = document.querySelector(".my-panel header");
const panelTitle = myPanelHeader.innerText;
myPanelHeader.innerText = panelTitle.toUpperCase();
myPanelHeader.parentElement.getAttribute("class");

8 / 12