Assignment for Week 12

1. Create a new HTML file (follow the instructions in Assignment 1 if needed, up to the step where you create the <title> element).
2. Create three files called blue.json, red.json, and green.json. In each file, insert this text:

   {"color":"value"}

   Where value is blue, red, or green, depending on the filename.
3. Add three <button> elements on the HTML page, giving them, respectively, ids and inner text of "blue", "red", and "green".
4. Include a <script> reference in the HTML file to the latest version of jQuery (available at the CDN Hosted jQuery section).
5. Create a JS file of your own and include a <script> reference to it in the HTML file.
6. Add behavior that makes clicking the buttons make an AJAX GET call that expects a dataType of "json", where the URL is the name of the JSON file that corresponds with the button. If the AJAX call is successful, take the data.color value and apply it as the background-color to the body of the page. jQuery functions you should use:
   • $
   • .click
   • $.ajax
   • .css
   Since these are <button> elements and not <input type="submit">, you don't need to return false at the end of your click callback, as buttons do nothing by default.
7. Upload the HTML, JSON, and JS files to your server and load the page up via HTTP.

Extra credit:

• Simplify your code (if you haven't already) so each button calls the same function but with a different parameter based on the id or inner text of the button. You will need these additional jQuery functions:
  • .attr() or .text()