Add selected option to FormData

I am trying to add a <option>

user selected to an ajax call sent to a php page. (I am not very familiar with ajax or jQuery)

I've built a JSFiddle and hopefully it will be easier to understand than I can explain. Here is its gist:

Html

<select name="internType" style="width: 100%; display: block; color: #000;" id="internType">
    <option selected value="default">Please Select</option>
    <option value="accounting">Accounting</option>
    <option value="auditing">Auditing</option>
    <option value="finance">Finance</option>
    <option value="humanresources">Human Resources</option>
</select>

      

        
        
        
      

    

JQuery

formData = new FormData( $(this)[0] );
self.sendData(formData);

sendData : function(formData){
    var self = this;
    var internChoice = $('#internType').val()   // This doesn't seem to hold the value
    formData.append('internChoice', internChoice);  // but rather the entire list
    console.log(formData);
    $.ajax({
        url: self.settings.path + '?i=' + self.settings.app ,
        type: 'POST',
        data: formData,
        async: false,
        success: function (data) {
            console.log(data);
            outcome = jQuery.parseJSON( data );
            self.handleOutcome(outcome);
        },
        cache: false,
        contentType: false,
        processData: false
    });
},

      

        
        
        
      

    

When I do var_dump($_POST);

, I get the data that is passed from the inputs, but from the dropdown I get a string containing all the values. For example:

["internSelect"]=>
string(130) "
    Please Select
    Accounting
    Auditing
    Finance
    Human Resources
"

      

        
        
        
      

    

What am I doing wrong and how can I best deal with what I am doing wrong?

Am I losing the selected value? The page never refreshes, so I'm not sure how this might be.

I am using jQuery 1.10.2 if you need to know that.