There are a bunch of blocks with the same style.

<div class='totall'> <a class='link'>text</a> <div class='opis' style="display:none;"> text text text </div> </div>

required by clicking $ ('. link'). click (function ()
change toggle visibility

tried so

 $('.link').click(function() { $(this).closest('.opis').toggle( "slow" ); });

    2 answers 2

    Change closest to next and truncated.

    The problem with closest is that he will look for the closest suitable element from among the following: the selected element itself, its parent, its progenitor , and not the closest one among the neighboring elements.

     $('.link').click(function() { $(this).next('.opis').toggle("slow"); }); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='totall'> <a class='link'>text</a> <div class='opis' style="display:none;"> text text text</div> </div> <div class='totall'> <a class='link'>text2</a> <div class='opis' style="display:none;">text2 text2 text2</div> </div> <div class='totall'> <a class='link'>text3</a> <div class='opis' style="display:none;">text3 text3 text3 </div> </div> <div class='totall'> <a class='link'>text4</a> <div class='opis' style="display:none;"> text4 text4 text4</div> </div>

    • It works for me in a simple html file not ( - Igor Fostyak
    • by the way $ (this) .parent ('. totall'). closest. ('. opis'). toggle ("slow"); should work too? - Igor Fostyak
    • @ Igor Fostyak Здесь работает у меня в простом хтмл файле нет( - apparently due to dynamic html. Try $('.totall').on('click', '.opis', function(){ ... - Alexey Shimansky
    • one
      @Igor Fostyak will not work here closest . I wrote why. he acts on himself and on his parents ... and not on the closest one - Alexey Shimansky
    • one
      @Ihor Fostyak if you need info on jquery functions in Russian - look in here jquery.page2page.ru/index.php5 for example jquery.page2page.ru/index.php5/Work_c_set_elements (and other pages too). Everything seems well described there - Alexey Shimansky

    Use the next() method

     jQuery(document).ready(function($) { $('.link').click(function() { $(this).next('.opis').toggle(); }); }); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='totall'> <a class='link'>Click</a> <div class='opis' style="display:none;"> text text text </div> </div> <div class='totall'> <a class='link'>Click</a> <div class='opis' style="display:none;"> text text text </div> </div> <div class='totall'> <a class='link'>Click</a> <div class='opis' style="display:none;"> text text text </div> </div>