I'm Trying to upload image on with jquery and ajax. But weird thing happened here. In console Log its showing

TypeError: 'append' called on an object that does not implement
interface FormData.

Please tell me what i did wrong here?

JS script

var prosrc=$(#pro_pix img).last().attr(src);

$(#logoform).on('change',function(event){

var postData = new FormData(this);

$(#pro_pix img).last().hide();

$(#pro_pix img).first().show();

event.preventDefault();

$.ajax(

    {

        url : /function/pro_pic_upload.php,

        type: POST,

        data : postData,

        success:function(data, textStatus, jqXHR)

        {

        $(#pro_pix img).last().show();

        $(#pro_pix img).first().hide();

        $(#pro_pix h6).text(data);

        },

        error: function(jqXHR, textStatus, errorThrown)

        {

            //if fails     

        }

    });

});

My HTML Markup

 <div class=row>

    <!-- left column -->

    <div id=pro_pix class=col-md-4 col-sm-6 col-xs-12>

      <div class=text-center>

        <img src=template/image/725.GIF class=avatar img-circle img-thumbnail style=display:none alt=avatar>

        <img src=<?php echo $rowuser['profile_logo']; ?> class=avatar img-circle img-thumbnail alt=avatar>

        <h6>Upload a different photo...</h6>

        <form role=form id=logoform enctype=multipart/form-data>

        <input id=logo name=logo type=file class=text-center center-block well well-sm>

        </form>

      </div>

    </div>