JQuery - Toggle Dynamic Content (Code Example Provided)

Posted on 2014-02-23
Last Modified: 2014-02-23
Hello All;

In this code, we can toggle 2 Fieldset's
However, when you click on either of the 2, they will both toggle down.
I need to only toggle the one that is clicked on.

Any assistance on this would be great.

Additional note:
This is just a test, there could be 2 - 50 of these, so it has to be completely dynamic.

<!DOCTYPE html>
<html >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src=""></script>  
<script type='text/javascript'>//<![CDATA[ 
$( ".clickit" ).click(function() {
  $( "p" ).slideToggle( "slow" );
<style type="text/css">


<fieldset class="BandHolder" id="1" style="background-color:#000; color:#999;">
<legend><span><div class="clickit">Show 1</div></button></span></legend>
<p class="Show">
<span style="font-family:Georgia; font-size:10pt;">Information for the top 1 goes here</span>


<fieldset class="BandHolder" id="2" style="background-color:#000; color:#999;">
<legend><span><div class="clickit">Show 2</div></button></span></legend>
<p class="Show">
<span style="font-family:Georgia; font-size:10pt;">Information for the bottom 2 goes here</span>


Open in new window

Question by:Wayne Barron
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
LVL 38

Accepted Solution

Tom Beck earned 500 total points
ID: 39881470
How about this:
<script type='text/javascript'>//<![CDATA[ 
$( ".clickit" ).click(function() {
  $(this).parents().next("p").slideToggle( "slow" );

Open in new window

B.T.W., you have a </button> with no opening tag.
LVL 31

Author Closing Comment

by:Wayne Barron
ID: 39881483
Thanks a BUNCH!!!!!!!!!!!
Yea, that Button got removed, as I replaced it with the DIV tag instead, and did not get it all moved out.

Once again, Thanks
You Rock!

LVL 38

Expert Comment

by:Tom Beck
ID: 39881489
You're welcome. Thanks for the points.

Featured Post

Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question