'I want to show/hide 'p' when the heading of that paragraph clicked using jQuery but as of now I am just trying to show 'p'

This is my jQuery. Here I am trying .next()

    var trigger =  $('alpha')
    $('h2').click(function(){    
       click = click.next('p');
       $('p').css('display', 'block');
    })
jquery


Solution 1:[1]

click does not refer to anything. You want to use $(this) to access to the clicked element.

Also, you can use .toggle() to easily show/hide elements:

$('h2').click(function() {
  $(this).next('p').toggle()
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<h2>Title 1</h2>
<p>Text 1</p>

<h2>Title 2</h2>
<p>Text 2</p>

<h2>Title 3</h2>
<p>Text 3</p>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 zessx

Related Questions