title: JavaScript Read response - JSON - FaceAPI
body: <p>I have this JSON response i need to get the values of some elements inside this response.
  The values i want to display is the value of "makeup" which has to elements in it which are, "eyemakeup" &amp; "lipmakeup" 
  i want to display it in an alert / or textbox.</p>
  
  <pre><code>[
   {
     "faceId": "90c30c46-2a51-4754-bff4-5079caf7e322",
  "faceRectangle": {
    "top": 91,
    "left": 101,
    "width": 121,
    "height": 121
  },
  "faceAttributes": {
    "smile": 0,
    "headPose": {
      "pitch": 0,
      "roll": -0.8,
      "yaw": -2.3
    },
    "gender": "male",
    "age": 30.3,
    "facialHair": {
      "moustache": 0.1,
      "beard": 0.5,
      "sideburns": 0.3
    },
    "glasses": "NoGlasses",
    "emotion": {
      "anger": 0.013,
      "contempt": 0.003,
      "disgust": 0,
      "fear": 0,
      "happiness": 0,
      "neutral": 0.983,
      "sadness": 0.001,
      "surprise": 0
    },
    "blur": {
      "blurLevel": "medium",
      "value": 0.28
    },
    "exposure": {
      "exposureLevel": "goodExposure",
      "value": 0.61
    },
    "noise": {
      "noiseLevel": "medium",
      "value": 0.39
    },
    "makeup": {
      "eyeMakeup": false,
      "lipMakeup": true
    },
    "accessories": [],
    "occlusion": {
      "foreheadOccluded": false,
      "eyeOccluded": false,
      "mouthOccluded": false
    },
    "hair": {
      "bald": 0.02,
      "invisible": false,
      "hairColor": [
        {
          "color": "brown",
          "confidence": 1
        },
        {
          "color": "black",
          "confidence": 0.78
        },
        {
          "color": "blond",
          "confidence": 0.23
        },
        {
          "color": "other",
          "confidence": 0.13
        },
        {
          "color": "red",
          "confidence": 0.09
        },
        {
          "color": "gray",
          "confidence": 0.03
          }
         ]
         }
         }
         }
    ]
  </code></pre>
  
  <p>The below is the javascript i have used so far and it is not giving me the correct values.</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
  function processImage() {
  
      var subscriptionKey = "mysubkey";
  
  
      var uriBase = "https://westcentralus.api.cognitive.microsoft.com/face/v1.0/detect";
  
      // Request parameters.
      var params = {
          "returnFaceId": "true",
          "returnFaceLandmarks": "false",
          "returnFaceAttributes": "age,gender,headPose,smile,facialHair,glasses,emotion,hair,makeup,occlusion,accessories,blur,exposure,noise",
      };
  
      // Display the image.
      var sourceImageUrl = document.getElementById("inputImage").value;
      document.querySelector("#sourceImage").src = sourceImageUrl;
  
      // Perform the REST API call.
      $.ajax({
          url: uriBase + "?" + $.param(params),
  
          // Request headers.
          beforeSend: function(xhrObj){
              xhrObj.setRequestHeader("Content-Type","application/json");
              xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key", subscriptionKey);
          },
  
          type: "POST",
  
          // Request body.
          data: '{"url": ' + '"' + sourceImageUrl + '"}',
      })
  
      .done(function(data) {
          // Show formatted JSON on webpage.
          $("#responseTextArea").val(JSON.stringify(data, null, 2));
          $("#demo2").val(this.responseText);
  
           var data =[JSON.stringify(data, null, 2)];
           var json = JSON.parse(data); 
           alert(json["eyeMakeup"]);       
     })
           .fail(function(jqXHR, textStatus, errorThrown) {
          // Display error message.
          var errorString = (errorThrown === "") ? "Error. " : errorThrown + " 
    (" + jqXHR.status + "): ";
          errorString += (jqXHR.responseText === "") ? "" : 
   (jQuery.parseJSON(jqXHR.responseText).message) ? 
              jQuery.parseJSON(jqXHR.responseText).message : 
   jQuery.parseJSON(jqXHR.responseText).error.message;
          alert(errorString);
      });
  };
      &lt;/script&gt;
  </code></pre>