Как при клике на один элемент, добавлять класс другому элементу на js?

У меня есть класс .header__burger, как при нажатии на него сделать так - чтобы добавлялся класс .active классу .main__title?

<header class="header">
    <div class="header__container container">
        <a class="header__logo-link" href="index.html">
            <img class="header__logo-img" src="./img/logo.svg" alt="HarryPotter">
        </a>
        <nav class="header__nav">
            <ul class="nav__list">
                <li class="nav__item">
                    <a class="nav__link" href="index.html">Главная</a>
                </li>
                <li class="nav__item">
                    <a class="nav__link" href="biograghy.html">Персонажи</a>
                </li>
                <li class="nav__item">
                    <a class="nav__link" href="music.html">Музыка</a>
                </li>
                <li class="nav__item">
                    <a class="nav__link" href="book.html">Книги</a>
                </li>
            </ul>
            **<div class="header__burger">**
                <span class="header__burger-line"></span>
                <span class="header__burger-line"></span>
                <span class="header__burger-line"></span>
            </div>
        </nav>
    </div>
</header>

<div class="main__content-top">
    **<h1 class="main__title">Harry Potter</h1>**
</div>

let burger = document.querySelector(".header__burger");
let navList = document.querySelector(".nav__list");

burger.addEventListener("click", mobileMenu);

function mobileMenu() {
    burger.classList.toggle("active");
    navList.classList.toggle("active");
}