How do we access the next element?

Question

How do I access .show-video-player if someone clicks on .video-play-pause? This is what I have so far, but it doesn't work.

$('.video-play-pause').on('click', (e) => {
  $(this).parent().next('.show-video-player').toggle();
  alert($(this).parent().next('.show-video-player').length);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="lesson">
  <div class="video-play-pause" data-url="{{url}}">video-play-pause</div>
</div>
<div class="show-video-player">show-video-player</div>

Hi try accessing it like this `$(event.currentTarget).parent().next('.show-video-player').toggle();` .Also have a look at [this](https://stackoverflow.com/a/27670450/10606400) answer to know reason. — Swati, Nov 18 '20 at 13:53

score 1 · Accepted Answer · answered Nov 18 '20 at 13:54

1

When accessing the parent of the clicked element, use event instead of this keyword. So you can change your selector to below: $(e.target).parent().next('.show-video-player').toggle()

answered Nov 18 '20 at 13:54

Placide

67
1
6

How do we access the next element?

1 Answers1