Multiple form with same attribute

i was trying to implement a comment system. where everybody can reply of every comment. The system here is when someone click on a comment a form will be visible and he can reply. So if there is 4 comments so 4 reply box will come. i wanted to store those reply through ajax. But the problem is i can't specify which form is actually submitting and so page got refresh as i specify the form with ID . i tried to submit the above form which will be visible under every comment if a user click on the reply button:

 <form id="replyComment">
      <textarea name="comment" class="ru_input" placeholder="Write your reply"></textarea>
      <input type="hidden" value="" name="comment_id">
      <div class="bt_area">
         <button class="floatRight btn btn-primary">Reply
         </button>
      </div>
   </form>

And i was trying to submit through following ajax.

$( "#replyComment").submit(function( event ) {      
 event.preventDefault();      
      $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
            $.ajax({
                type: "POST",
                url: '',
                async: false,
                data: 
                {
                  product_id : {!! json_encode($product->id)!!},
                  comment : event.currentTarget[0].value,
                  comment_id : event.currentTarget[1].value
                },
                success: function(data) 
                {
                  console.log(data)

                },
                error:function(data)
                {

                }

            });
});

via Chebli Mohamed