How do I modify the class within the same action as a toggle effect, which works independently very well? (I have multiple blocks with the same classes)
$(".w_content").hide();
$(".w_target").click(function()
{
$(this).parent().next('.w_content').toggle();
});
If I include this code:
$(".w_content").hide();
$(".w_target").click(function()
{
$(this).parent().next('.w_content').toggle();
$(".toggle").toggleClass("oN oFF");
});
It works on the first element. On the next one, it adds the class again to the first, and so on.
How can I apply this only to the current toggle function?
The HTML structure appears like this:
<div id="somewhereBar" class="toggle oFF">
<div class="sharepost">
<div class="w_target"><a class="abc"></a></div>
</div>
<div id="abec" class="w_content">
<p id="text-selected" class="">text that should be shown/hidden</p>
</div>
</div>
<div id="somewhereBar" class="toggle oFF">
<div class="sharepost">
<div class="w_target"><a class="abc"></a></div>
</div>
<div id="abec" class="w_content">
<p id="text-selected" class="">text that should be shown/hidden</p>
</div>
</div>
The oN/oFF classes should only adjust the height of the current parent div to show the text in the last nested div.
I realize that I am using