jquery toggle() problem

Question

I wanted to write a code that after toggling(hiding, showing) the div element checks for the existence of it so that if exists, makes the background color of body element red and if not makes it blue. it makes it red even when I check for non-existence of it! and it doesn't make it blue after becoming hidden
how should rewrite the code to fix it?

https://code.sololearn.com/W6aw2moZy6u0/?ref=app

Answer 1

Take a look at the following article

https://www.google.com/amp/s/www.geeksforgeeks.org/how-to-check-if-an-element-is-hidden-in-jquery/amp/

Answer 2

Arturop thank you. that worked
I also found another way to approach this:
https://code.sololearn.com/W2tUnsCTX21E/?ref=app

Answer 3

$(function() {
let f = true;
$("p").click(function() {
$("div").toggle(1000, function(){
if(f){
$("body").css("background-color", "red");
f = false;
}
else{
$("body").css("background-color", "blue");
f = true;
}
});
});
});