Jquery Нужно сделать цикл для того чтобы всплывающее окно открывалось для всех записей

Question

У меня есть всплывающее окно Jquery. Оно работает, но только для первой записи.

<a id="button">
    share
</a>
<div id="content">
    <p>Content</p>
</div>

<script>
$(document).ready(function(){

    $('#button').click( function(e) {
        e.preventDefault();
        e.stopPropagation();
        $('#content').toggle(200);
    });

    $('#content').click( function(e) {
        e.stopPropagation();
    });

    $('body').click( function() {
        $('#content').hide(200);
    });
});
</script>

Пробовал с помощью each и next(), но ничего не вышло. Как сделать, чтобы всплывающее окно открывалось для всех записей, а не только для первой?

Answer 1

$(document).ready(function() {
  $('.button').click(function(e) {
    e.preventDefault();
    e.stopPropagation();
    $(this).next('.content').toggle(200);
  });

  $('.content').click(function(e) {
    e.stopPropagation();
  });

  $('body').click(function() {
    $('.content').hide(200);
  });
});

.content {
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="button">
    share 1
</a>
<div class="content">
  <p>Content 1</p>
</div>
<br/>
<a class="button">
    share 2
</a>
<div class="content">
  <p>Content 2</p>
</div>

БЛОГ НА HUSL

Jquery Нужно сделать цикл для того чтобы всплывающее окно открывалось для всех записей

Ответы (1 шт):