Only current child element
Hello,
I've 2 field sets and a div inside each fieldset with some contents. When the legend of the current fieldset is clicked, I will toggle the div contents. I'm trying to write a generic function which can be used by everyone. Here is my design:
-
<fieldset id="fs1">
<legend id="leg1">First Legend</legend>
<div id="div1">
"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas
sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione
voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor
sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt
ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam,
quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid
ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate
velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
voluptas nulla pariatur?"
</div>
<div>
Sample text here
</div>
</fieldset>
<fieldset id="fs2">
<legend id="leg2">Second Legend</legend>
<div id="div2">
"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium
voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint
occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt
mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est
et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio
cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas
assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis
debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint
et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus,
ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus
asperiores repellat."
</div>
<div>
Sample text here
</div>
</fieldset>
Javascript:
-
<script type="text/javascript">
$("legend").live("click", function()
{
alert($(this+ "+div").text());
});
</script>
I'm trying to get the contents of the div for testing purpose. But I'm not getting it. I dunno whether the above method is right or not.
When I click "First Legend", it should show only the first contents and same for "Second Legend".
Any help? Very urgent.[/u]