Javascript-форум - скрыть/показать блок по клику

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - скрыть/показать блок по клику (https://javascript.ru/forum/misc/55484-skryt-pokazat-blok-po-kliku.html)

скрыть/показать блок по клику

здравствуйте!
помогите, пожалуйста, начинающему :)

есть код

<body>
    <h1>vfvfvfvf</h1>
    <div class="filter-box">
      <div class="hidden">
        <strong class="title">rrrrr</strong>
        <div class="checkbox">
          <ul>
            <li>111</li>
            <li>222</li>
            <li>333</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >qqqqq</strong>
        <div class="checkbox">
          <ul>
            <li>456</li>
            <li>789</li>
            <li>123</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >ffffff</strong>
        <div class="checkbox">
          <ul>
            <li>147</li>
            <li>2258</li>
            <li>36598</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >ssssss</strong>
        <div class="checkbox">
          <ul>
            <li>dddd111</li>
            <li>222dddd</li>
            <li>333aaaa</li>
          </ul>
        </div>
      </div>
    </div>

Задача: по клику на <strong class="title" >ssssss</strong> необходимо свернуть/показать <div class="checkbox">

$(document).ready(function(){
$(".hidden").click(function(){
  $('.checkbox', this).toggle();
});
});

Этот скрипт сворачивает, но не только по клику на title, а еще и по клику на checkbox. Но так не устраивает. Как решить задачу?

nmlgko,
так и ставьте клик на

Цитата:

Сообщение от nmlgko

class="title"

что мешает?

а не работает! ))
решили вопрос вот так

$(".title").click(function(){
  $(this).next('.checkbox')
            .toggle();
});

Тоже самое другими словами)

$('.title').click(function(e){
		  $(e.target).next().toggle();
	  });

nmlgko,
:) открывашка 216 делегирование

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .checkbox  {
    display: none;

  }

  .title {
     cursor: pointer;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
   $(function()
     {
       $(".hidden").on("click", ".title", function(event)
         {
           $('.checkbox', event.delegateTarget).toggle();
         }
       );
     }
   );
  </script>
</head>

  <body>
    <h1>vfvfvfvf</h1>
    <div class="filter-box">
      <div class="hidden">
        <strong class="title">rrrrr</strong>
        <div class="checkbox">
          <ul>
            <li>111</li>
            <li>222</li>
            <li>333</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >qqqqq</strong>
        <div class="checkbox">
          <ul>
            <li>456</li>
            <li>789</li>
            <li>123</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >ffffff</strong>
        <div class="checkbox">
          <ul>
            <li>147</li>
            <li>2258</li>
            <li>36598</li>
          </ul>
        </div>
      </div>
      <div class="hidden">
        <strong class="title" >ssssss</strong>
        <div class="checkbox">
          <ul>
            <li>dddd111</li>
            <li>222dddd</li>
            <li>333aaaa</li>
          </ul>
        </div>
      </div>
    </div>



</body>

</html>