i'm developing a blog with dynamic content loaded via ajax request and i'm trying to hide/show the "post comment" form, of the article, with a button :

<div id="post">
...
  <ol id="update" class="timeline">
    <!-- comments here -->
  </ol>
  <button class="mybutton Bhome">Commenta</button><!-- hide/show button -->
  <div class="mycomment"><!-- div to hide/show -->
    <form action="#" method="post">
      Nome:
      <input type="text" size="12" id="name" /><br />
      Email:
      <input type="text" size="12" id="email" /><br />
      <textarea rows="10" cols="50" class="mytext" id="commentArea"></textarea><br />
      <input type="submit" class="Bhome" value=" Post " />
    </form>
  </div><!-- mycomment --> 
</div><!-- post -->  

This jquery code works well but has effect on All the posts...

$("div").on("click", ".mybutton", function(e){ 
  $(".mycomment").slideToggle("slow");
  e.stopPropagation();
});

I want that only the clicked hide/show button has effect on the related article but f i have more than one article on my page the button with .mybutton class hides or shows all the comment form of all the articles.