jQuery toggle function doesnt do anything

Question

I want class .lrm to show up whenever I click class a with jquery I disabled .lrm with css display:none; and want to show up with jquery toggle method

<div id="main">
        <h1>Boora boora</h1>
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        <a href="#">More info</a>
        <p class="lrm">"Lorem ipsum dolor sit amet, consectetur</p>
    </div>

$(document).ready(function () {
    $('#main').on('click', 'a', function (event) {
        event.preventDefault();
    })
    $(this).closest('#main').find('.lrm').toggle('fast');
})

Move the command that toggles INSIDE the click handler. It is OUTSIDE the click handler. — Nawed Khan
– Nawed Khan, Commented Jun 10, 2019 at 22:07

Nawed Khan · Accepted Answer · 2019-06-10 22:09:28Z

1

Move the command that toggles INSIDE the click handler:

$(document).ready(function () {
    $('#main').on('click', 'a', function (event) {
        event.preventDefault();
        $(this).closest('#main').find('.lrm').toggle('fast');
    });
});

answered Jun 10, 2019 at 22:09

Nawed Khan

4,3911 gold badge12 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

David · Accepted Answer · 2019-06-10 22:09:52Z

0

jQuery toggle function doesnt do anything

Sure it does. Yours just isn't being executed because there's no matching element(s).

This line isn't in your click handler:

$(this).closest('#main').find('.lrm').toggle('fast');

It executes once when the page loads (well, when the document is ready). And at that time this is the document, which has no closest #main. Since .closest() returns an empty set, find is never executed and toggle is never executed.

Put the line inside the click handler:

$('#main').on('click', 'a', function (event) {
    event.preventDefault();
    $(this).closest('#main').find('.lrm').toggle('fast');
});

answered Jun 10, 2019 at 22:09

David

221k42 gold badges246 silver badges338 bronze badges

Collectives™ on Stack Overflow

jQuery toggle function doesnt do anything

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related