¿Cómo cambiar la clase de un elemento HTML con JavaScript?

¡Hola a todos! Acabo de empezar a aprender JavaScript y no puedo entender cómo cambiar las clases de los elementos en la página. Tengo una estructura HTML simple: ```html Haz clic en mí ``` Quiero que al hacer clic en el botón, el div cambie su clase de "red" a "blue" (es decir, que el color cambie de rojo a azul). Intenté escribir algo como `document.getElementById('myDiv').class = 'blue'`, pero no funciona. En la consola aparece el error: "Uncaught TypeError: Cannot set properties of null". Aunque el elemento definitivamente existe en la página, lo verifiqué. Luego descubrí que debería usar `className`, pero cuando escribo `document.getElementById('myDiv').className = 'blue'`, la clase "box" desaparece del elemento, y necesito que se mantenga. Es decir, quiero reemplazar solo una clase, no todas. Por favor, indíquenme cómo trabajar correctamente con las clases en JavaScript. ¿Cómo agregar una nueva clase sin eliminar las antiguas? ¿Cómo eliminar una clase específica? ¿Y cómo