$(document).ready(function(){
$("button").click(function(){
if ($("p").offsetParent().css("background-color") === "red") {
$("p").offsetParent().css("background-color", "yellow");
} else {
$("p").offsetParent().css("background-color", "red");
}
});
});
<button>Set background-color</button>
<div style="border:1px solid black;width:70%;position:absolute;left:10px;top:50px">
<div style="border:1px solid black;margin:50px;background-color:yellow">
<p>Click button to set the background color of the first positioned parent element of this paragraph.</p>
</div>
</div>
With the current code, clicking the button changes the background color to red. However, I want to implement a toggle functionality where clicking the button again will change the background color back to its original state (yellow).