Have Geek Brain

Jquery toggles more than one div

I am trying to do toggling div with only 1 javascript.

I tried this, the first div does what it was supposed to do and the second one doesn't.

Take a look.

<body>
    <div>
    <div>He
        <div>You
            <div id="Me"><a id="me">Me</a></div>
        </div>
    </div>
    <div id="This">We
    </div>
    </div>
    <div>

    <div>1
        <div>2
            <div id="Me"><a id="me">3</a></div>
        </div>
    </div>
    <div id="This">4
    </div>
    </div>
<script>
    $("#me").click(function () {
      $(this).parent().parent().parent().siblings("#This").slideToggle("slow");
    });
</script>
</body>

When I click on me, we disappear, okay. But when I press 3, 4 doesn't disappear.

+2


a source to share


2 answers


The identifiers are expected to be unique. For "markers" you can use the "class" attribute. (not sure if this is the reason, but there is a good chance it is)



+5


a source


if you don't want to add classes for whatever reason, you can set up multiple ids at once using jQuery. However, you will still need unique identifiers.

If you want to switch multiple ids in one call, you should do something like:



$('#id1, #id2, #id3').slideToggle();

+1


a source






More articles:


All Articles