Home/ Questions/Q 3423350
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T06:20:40+00:00

I have the following code: <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>Untitled Page</title> <script class=jsbin src=http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js></script> <script

  • 0

I have the following code:

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Untitled Page</title>
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $(".Note").click(function(){
        $(this).parent().parent().next(".divNote").slideToggle();
        });
    });
    </script>

  </head>
  <body>
    <table>
        <tr>
            <td class="Note" style="cursor: pointer">
                <font size="3" color="#800080"><b><u>TD</u></b> </font>
            </td>
        </tr>
    </table>
    <br />
    <div style="display: none" class="divNote">
    </div>
  </body>
</html>

I can figure out why it is not working.

example: Here

Any help.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Let me explain why it doesn’t work

    You’ve added a filter to next() function that filters out only matching elements. In your case it only contained one element (br) which didn’t have the matching class name, so the resulting set was truncated to zero elements.

    The way to make it work

    So instead of simply filtering next element you have to filter out from all siblings:

    $(document).ready(function() {
  $(".Note").click(function(){
    $(this).parents("table").siblings(".divNote").slideToggle();
  });
});

    or filter out from all next siblings (when previous siblings aren’t relevant at all)

    $(document).ready(function() {
  $(".Note").click(function(){
    $(this).parents("table").nextAll(".divNote").slideToggle();
  });
});
    • 0