[jQuery] Re: SlideToggle a DIV inside another DIV

[Liam Potter]

my mistake, should of been
child should be chilren

$(document).ready(function() {
        $(".guestbook_result .btn-edit").click(function(){
                $(this).parent().children(".guestbook_edit").slideToggle();
});



StoneGut wrote:

No Go - thought that would do it though ... looks like it SHOULD work.


On Dec 8, 11:30 am, Liam Potter <[EMAIL PROTECTED]> wrote:

ok try this

  $(document).ready(function() {
     $(".guestbook_result .btn-edit").click(function(){
        $(this).parent().child(".guestbook_edit").slideToggle();

     });

StoneGut wrote:

Didn't work - thanks though - tried the whole SIBLING thing as well
before.

I simplefied my code example for the post -- here is that section in

whole:

<script type="text/javascript">

  $(document).ready(function() {
     $(".guestbook_result .btn-edit").click(function(){
   $(this).sibling(".guestbook_edit").slideToggle();

}); });

</script>

<div class="guestbook_result" style="background-color:#f7f7f7; border:

1px solid #c1c1c1; width:630px; margin-top:10px; float:left; padding:
4px;"  onMouseOver="this.style.backgroundColor='#f1f1f1';
this.style.borderColor='#579e18';"
onMouseOut="this.style.backgroundColor='#f7f7f7';this.style.borderColor='#c1c1c1';">

<font class="guestbook_name"><?php echo $name; ?></font><font

class="guestbook_location"> from <?php echo $location; ?></font><br />
   <div style="padding-left:15px;"><font class="guestbook_comment">"<?
php echo $comment; ?>"</font></div>
       <div style="text-align:right;"><font class="guestbook_date"><?
php echo $date; ?></font></div>
       <div style="border-top:1px dashed #CCC; text-align:left;
padding-top:5px; margin-top:4px; width:630px;">

<font class="main_text"><a href="admin_guestbook.php?

action=approve&amp;id=<?php echo $id; ?>">Approve</a> | <a href="#"
class="btn-edit">Edit</a> | <a href="admin_guestbook.php?
action=delete&amp;id=<?php echo $id; ?>" onclick="return confirm
('CONFIRM DELETION - THIS CAN NOT BE UN-DONE')">Delete</a></font>
                </div>

<div class="guestbook_edit" style="background-

color:#CCC; width:600px;display:none;">
                   <font class="main_text"><br />TEST<br /><br /><?php echo 
$comment; ?

<br /><br /></font>

           </div><!--GUESTBOOK EDIT-->

</div> <!--Entry container--> On closer inspection it seems my "EDIT" link is within another DIV

(for formatting and positioning) --- ack!

On Dec 8, 11:10 am, Liam Potter <[EMAIL PROTECTED]> wrote:

try this

$(document).ready(function() {

  $(".gb_result .btn-edit").click(function(){
        $(this).sibling(".gb_edit").slideToggle();
    });
  });

StoneGut wrote:

Hello,

I have a div (gb_results) that includes another div (gb_edit) - when a

button with class "edit" in the gb_results DIV is click I need the
gb_edit DIV to toggle in / out.

The only thing is that the gb_results DIV is generated dynamically

through a database query so I can't name each one as if they were
static. I'm tearing my hair out using different variations of THIS or
NEXT or FIND and not of them work. The only thing I can accomplish is
if any of the "edit" buttons are clicked all of the gb_edit DIV's
appear (shown below).

Please Help! JQuery Code: <script type="text/javascript">

  $(document).ready(function() {
  $(".gb_result .btn-edit").click(function(){
   $(".gb_edit").slideToggle();
    });
  });
</script>

<div class=gb_results">

<p>RESULTS DISPLAYED HERE</p>
<a href="#" class="edit">Edit</a>

<div class="gb_edit">

      <p>EDIT CONTENT IN HERE</p>
   </div>

</div>