Написание простой пользовательской информации о функции click для jquery, требующей рефакторинга

Question

Я хочу иметь возможность многократно использовать одну и ту же функцию на одной странице.

Итак, вот некоторый псевдо-код:

$(".read_more").click(function(){
$(this).parents().find(".hidden_text").slideToggle("fast")
});

Однако проблема с этим кодом заключается в том, что он нацелен на каждый элемент на странице, соответствующий .hidden_text. Есть ли способ объединить closest () с этим? Или есть лучший способ реорганизовать это?

Обновление:

HTML:

<div class="grid_2">
  <div class="read_more">
    Click Me
  </div>
</div>

<div class="grid_2">
  <div id=".hidden_text">
    Bagels are the most resourceful tools to the most legendary programmers.
  </div>
</div>

Answer 1

Я думаю

$(this).closest("*:has(.hidden_text)").find(".hidden_text").slideToggle("fast");

будет работать.

Answer 2

Вы захотите добавить 'return false', чтобы прекратить прыгать

$(".read_more").click(function(){
    $(this).next(".hidden_text").slideToggle("fast");
    return false;
});

И, очевидно, добавить к css

.hidden_text {
    display:none
}

Answer 3

, если скрытый контент находится на том же уровне, что и ваша ссылка для дополнительной информации, например:

<div>
    blbalbblal allalfdk 
    <a class="readmore">read more</a>
    <div class="hidden-text" style="display:none">other bla bla bla</div>
</div>

Затем вы можете использовать следующий селектор

   $(".readmore").click(function(){
        $(this).next(".hidden_text").slideToggle("fast")
    });