Changing the color of an element on every click (Vice-Versa)

Hey I am trying to change an elements background color to red when its beige and beige when its red. I've tried using the right if statement but i cant seem to find to solution. I would be super happy if someone helped me! Thanks.

HTML

<div id="first" class="firstdiv">
    <h2>DenemeTahtası</h2>
    <div>
        <section id="lorem">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis sit dolor, soluta ab illum aperiam
            quam! Eum, delectus aliquam ipsa perspiciatis modi perferendis laudantium aut vel, ut veniam quae
            eligendi?
        </section>
    </div>
</div>

CSS

.firstdiv{
background-color: antiquewhite;
height: 50vh;

h2{
   
    margin-left: 40%;
    padding-top: 20px;

}

#lorem{
    margin: 0 auto;
    width: 65%;
    margin-top: 25px;
    text-align: center;
}

}

JS

    let exp = document.querySelector("#lorem")
exp.style.backgroundColor = "beige"
exp.addEventListener("click", colorChange)

function colorChange() {

    if (exp.style.backgroundColor = "beige") {
        exp.style.backgroundColor = "red"
    }
    else if (exp.style.backgroundColor = "red") {
        exp.style.backgroundColor == "beige"

    }

}