I have an element <div class="my-thing"></div>

I need to programmatically toggle the bottom property in javascript, so I have a simple click event that calls a function with this if statement:

if(element.style.bottom === "") {
   //do something
}

if( element.style.bottom !== "") {
   //do something else
}

However both of these if statements trigger at the same time if I don’t have style set on my div. If I /do/ set style like style="bottom: 120px;" then the second statement gets triggered.

When it’s empty I need only the first if statement to trigger, not both.

I tried changing === "" to === null or === undefined or all 3 separated by ||, and the same thing still happens. I also tried !element.style.bottom. None worked.

When I do console.log(element.style.bottom) when it’s empty, I get <empty string> as a response in the console.

So how do I target a non-set property???