JSFiddle - React, Tailwind, and code Playground

by CGWGreen

HTML

<div class="bubble">Click Me
 
  <p class="slide-up">
    This is the paragraph to end all paragraphs.  You
    should feel <em>lucky</em> to have seen such a paragraph in
    your life.  Congratulations!
  </p>

</div>

<div class="bubble">Click Me
 
  <p class="slide-up">
    This is the paragraph to end all paragraphs.  You
    should feel <em>lucky</em> to have seen such a paragraph in
    your life.  Congratulations!
  </p>

</div>

<div class="bubble">Click Me
 
  <p class="slide-up">
    This is the paragraph to end all paragraphs.  You
    should feel <em>lucky</em> to have seen such a paragraph in
    your life.  Congratulations!
  </p>

</div>

CSS

p { width:400px; }

JavaScript

$(".bubble").each(function(){
    $(this).click(function() {
        $(this).find('.slide-up').slideToggle(1000);              
    })
});