Currently, I am working on implementing the 'OnClick' functionality in jQuery. The goal is to have only the parent div and its child divs displayed when we click on the parent div property, while fading out all other divs.
Below you can find the HTML code:
<div>1</div>
<div class="ree">2</div>
<div class="foo">items
<div class = "bar">Shoes
<div class="nike">3</div>
<div class="puma">5</div>
<div class="gap">5</div>
</div>
</div>
<div>4</div>
This is how the jQuery code is structured:
$('.foo').on('click',function ()
{
$('div:not(.foo)').css('opacity','0.2')
});
The desired effect of clicking on the 'foo' class div is to display only 'foo' and its child divs like 'bar', 'nike', 'puma', and 'gap', while fading out all other div classes.
You can view a demo by visiting the following link:
Thank you for your assistance!