JSFiddle - React, Tailwind, and code Playground

by ashleycam3ron

HTML

<div>
    <h3>Heading 1</h3>
    <p>This is a paragraph but not really.</p>
    <h3>Heading 2</h3>
    <p>This is a paragraph but not really.</p>
    <h3>Heading 3</h3>
    <p>This is a paragraph but not really.</p>
</div>

CSS

h3 {font-weight:bold;}
p {display:none;}

JavaScript

$(document).ready(function() {
    //$("h3").click(function(){
    //$("p(even)").slideToggle("slow");
    $('h3').first().click(function() {
        $('p').first().slideToggle("slow");
    });
    $('h3:eq(1)').click(function() {
        $('p:eq(1)').slideToggle("slow");
    });
    $('h3:eq(2)').click(function() {
        $('p:eq(2)').slideToggle("slow");
    });
});