Learning Goal: I’m working on a jquery / prototype question and need support to help me learn.Create a page that uses XHR to communicate with an external URL and retrieve values in JSON and generate colour swatches based on the returned values.Include a button on the page that says “Request Swatch”.
Clicking the button will trigger a GET XHR request to the colors.php file located below.You must include a URL query parameter called passcode with a value of zebra!
You must include a URL query parameter called username
You must take the response (JSON) and create a new color swatch box, which is a
Color Swatch Box SpecificationsA new swatch box is created for each successful request.
The background-color of each box should match what is returned from the server.
The text inside the box should be the name of the swatch returned from the server.
Each box must be 200×200 pixels, which means the background colour as seen by the user is 200×200.
We don’t want the text touching the edge, so make sure there’s 10px of padding on it.
Boxes should have 20px margin between them, so they don’t touch.
The titles of the colors must be in white (#FFFFFF).
The boxes should sit next to each other and continue to spill over, left to right as more are added. They should spill to new lines if needed.
Each time you press the button, another swatch is generated and added to the page.