Jquery slide toggle not showing content on click

Question

When I click on More Information, it changes to Less Information but the content under doesn't slide toggle in.

https://jsfiddle.net/n1gLn63y/

$(document).ready(function() {
  $(".content").hide();
  $(".toggle").on("click", function() {
    var txt = $(".content").is(':visible') ? 'More Information' : 'Less Information';
    $(".toggle").text(txt);
    $(".toggle").toggleClass('active');
    $(this).next('.content').slideToggle(450);
    e.stopPropagation();
  });
});

EDIT: Include relevant html from fiddle

<div class="description">

  <div class="descriptionTitle">
    <p class="Title"> KITAI / SELF-DIAGNOSIS </p>
    <p class="toggle">More Information</p>
  </div>

  <div class="content">
    content here
  </div>
</div>

Answer 1

$(this).next doesn't find .content as it's not a sibling.

.next only finds elements that have the same parent (siblings).

Try:

$(this).closest(".descriptionTitle").next('.content').slideToggle(450);

or rearrange your html

Answer 2

https://jsfiddle.net/officert/h7w40494/

$(document).ready(function() {
  $(".content").hide();
  $(".toggle").on("click", function() {
    var txt = $(".content").is(':visible') ? 'More Information' : 'Less   Information';
  $(".toggle").text(txt);
  $(".toggle").toggleClass('active');
  $('.content').slideToggle(450); //this was the problem
  e.stopPropagation();
});

where you were doing $(this).next('.content').slideToggle(450); was the issue. In this case $(this).next('.content') means get the sibling element with class .content , but the element with .content is not a sibling.

Answer 3

$(this).next('.content').slideToggle(450);

that element do not have next element with content class, But its parent have,So:

$(document).ready(function() {
  $(".content").hide();
  $(".toggle").on("click", function(e) {
    e.stopPropagation();
    var txt = $(".content").is(':visible') ? 'More Information' : 'Less Information';
    $(".toggle").text(txt);
    $(".toggle").toggleClass('active');

    $(this).parent().next('.content').slideToggle(450);
  });
});

https://jsfiddle.net/n1gLn63y/2/