Как сделать открытие блоков по клику, когда их несколько?

Question

[Stile423]

Добрый день всем!
Возник такой вопрос, у меня есть страница (образно) на ней несколько дивов с одинаковым классом, у каждого этого дива есть скрытый блок, также с одинаковыми классами. Необходимо сделать открытие этих скрытых блоков по клику на элемент (ссылку). У меня получается вот такой код (это пример, не основной)

<div class="qwe">
<a href="#">OPEN</a>
<div class="op">
<a class="cl" href="#">CLOSE</a>
<h1>GOOD</h1>
</div>
</div>
<div class="qwe">
<a href="#">OPEN</a>
<div class="op">
<a class="cl" href="#">CLOSE</a>
<h1>GOOD</h1>
</div>
</div>

.qwe {
  height: 300px;
  width: 300px;
  border: 2px solid #000;
  position: relative;
  float: left;
  margin-left: 20px;
}

.op {
  background: #777;
  position: absolute;
  width: 100%;
  display: none;
  top: 100%;
}
.actives {
  display: block;
}

$(function(){
            $('a').click(function(){
                $('.op').addClass('actives');
            });
        });
$(function(){
            $('a.cl').click(function(){
                $('.op').removeClass('actives');
            });
        });

Проблема в том, что открываются сразу все блоки, а мне надо чтобы открывались и закрывались только элемент который принадлежит родителю.
Яву изучаю недавно, никак не могу сообразить. Готовые решения это хорошо, но хотелось бы просто понять самому, что нужно дополнить в скрипт, что бы это работало.
Или может есть вариант на CSS?

Comments

[WapSter]

Яву? Тебе самому не противно как это звучит? И твоя "Ява" это не js и не es максимум java.

[Модератор]

Не нужно писать благодарности в ответе. Отметьте решением те вопросы, которые вам помогли - это будет лучше благодарностью их авторам.

Answer 1

[0xD34F]

$(document).on('click', '.qwe > a', function() {
  $(this).next('.op').addClass('actives');
});

$(document).on('click', '.cl', function() {
  $(this).closest('.op').removeClass('actives');
});

Или может есть вариант на CSS?

есть

Answer 2

[irishmann]

как-то так

Answer 3

[Шохрух Шаймардонов]

Вот тут я аналогичный код привел. Простейший цикл для изменения состояний

Answer 4

[forspamonly2]

в хтмл5.1 уже есть details/summary