Toggle Button Inside Accordion Using Jquery

I want to create a toggle button inside an accordian. Here is what I was trying to do. Javascript $j('div a').live('click', function() { $j('#toggleButton').click(function () {

Solution 1:

Try this please Working Demo http://jsfiddle.net/stXP6/ or http://jsfiddle.net/z8Jns/

Oh and your HTML ain't valid I have rectified it a bit now using class. i.e. id defines identity of the element hence it should be unique.

Hope it fits your need :)

code

$(".test").hide();
$(".toggleButton").click(function() {
    $(this).next(".test").slideToggle("slow");
});​

HTML

<h3><a href="#">Number 1</a></h3><div><h4> Error1:</h4><p> some contents here </p><div id="content1"><input type="button" value="Hide" class="toggleButton" style="float:right;"><div class="test"> <p>jhfsnv jv jsdhv jsdvb </p></div></div></div>
<h3><a href="#">Number 2</a></h3><div><h4> Error2:</h4><p> some contents here </p><div id="content1"><input type="button" value="Hide" class="toggleButton" style="float:right;"><div class="test"> <p>jsa shsbc sjhv sf </p></div></div></div>
Here​​