599 lines
23 KiB
JSON
599 lines
23 KiB
JSON
{
|
|
"name": "jQuery, Ajax and JSON",
|
|
"dashedName": "jQuery, Ajax and JSON",
|
|
"order": 0.004,
|
|
"challenges": [{
|
|
"id": "bad87fee1348bd9acdd08826",
|
|
"name": "Waypoint: Learn how Script Tags and Document Ready Work",
|
|
"dashedName": "Waypoint: Learn how Script Tags and Document Ready Work",
|
|
"difficulty": 0.072,
|
|
"description": [
|
|
"We've simplified our Cat Photo App and removed our <code>style</code> element. Add a <code>script</code> element to your page and create a <code>$(document).ready</code> function within it.",
|
|
"Add <code>$(document).ready(function() {</code> to your <code>script</code> element, and then close it on the following line with <code>});</code>."
|
|
],
|
|
"tests": [
|
|
"assert(editor.match(/<script>/g), 'Create a <code>script</code> element.')",
|
|
"assert(editor.match(/<\\/script>/g) && editor.match(/<script/g) && editor.match(/<\\/script>/g).length === editor.match(/<script/g).length, 'Make sure your <code>script</code> element has a closing tag.')",
|
|
"assert(editor.match(/\\$\\(document\\)\\.ready\\(function\\(\\)\\s?\\{/g), 'Add <code>$(document).ready(function() {</code> to the beginning of your <code>script</code> element.')",
|
|
"assert(editor.match(/\\n\\s+?\\}\\);/g), 'Close your <code>$(document).ready(function() {</code> function with <code>\\}\\);</code>.')"
|
|
],
|
|
"challengeSeed": [
|
|
"",
|
|
"",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9bedc08826",
|
|
"name": "Waypoint: Target Elements by Selectors Using jQuery",
|
|
"dashedName": "waypoint-target-elements-by-selectors-using-jquery",
|
|
"difficulty": 0.073,
|
|
"description": [
|
|
"Make all <code>button</code> elements bounce <code>$('button').addClass('animated bounce')</code>."
|
|
],
|
|
"tests": [
|
|
"assert($('button').hasClass('animated') && $('button').hasClass('bounce'), 'Use the jQuery <code>addClass()</code> function to give the classes \"animated\" and \"bounce\" to your <code>img</code> element.')",
|
|
"assert(!editor.match(/class.*animated/g), 'Only use jQuery to add these classes to the element.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aedc08826",
|
|
"name": "Waypoint: Target Elements by Class Using jQuery",
|
|
"dashedName": "waypoint-target-elements-by-class-using-jquery",
|
|
"difficulty": 0.074,
|
|
"description": [
|
|
"Make all the <code>div</code> elements with class \"well\" shake. <code>$('.well').addClass('animated shake')</code>"
|
|
],
|
|
"tests": [
|
|
"assert($('.well').hasClass('animated') && $('.well').hasClass('shake'), 'Use the jQuery <code>addClass()</code> function to give the classes \"animated\" and \"shake\" to all your elements with the class \"well\".')",
|
|
"assert(!editor.match(/class.*animated/g), 'Only use jQuery to add these classes to the element.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
{
|
|
"id": "bad87fee1348bd9aeda08826",
|
|
"name": "Waypoint: Target Elements by ID Using jQuery",
|
|
"dashedName": "waypoint-target-elements-by-id-using-jquery",
|
|
"difficulty": 0.075,
|
|
"description": [
|
|
"Make all the <code>button</code> element with the id \"target3\" pulse. <code>$('#target3').addClass('animated pulse')</code>."
|
|
],
|
|
"tests": [
|
|
"$('#target3').hasClass('animated') && $('#target3').hasClass('pulse'), 'Select the <code>button</code>element with the <code>id</code> of \"target3\" and use the jQuery <code>addClass()</code> function to give it the classes of \"animated\" and \"pulse\".')",
|
|
"assert(!editor.match(/class.*animated/g), 'Only use jQuery to add these classes to the element.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed908826",
|
|
"name": "Waypoint: Change the CSS of an Element Using jQuery",
|
|
"dashedName": "waypoint-change-the-css-of-an-element-using-jquery",
|
|
"difficulty": 0.076,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
"assert(!editor.match(/nce\\'\\)\\;/g) && !editor.match(/ke\\'\\)\\;/g), 'Delete your <code>img</code> element selector statement and your \".btn\" selector statement.')",
|
|
"assert(editor.match(/css.*,.*background-color.*gray.\\);/g), 'Select the element with the <code>id</code> of \"cat-photo-form\" give it the background color of gray.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed808826",
|
|
"name": "Waypoint: Disable an Element Using jQuery",
|
|
"dashedName": "waypoint-disable-an-element-using-jquery",
|
|
"difficulty": 0.077,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
"assert($('form button').attr('id') === 'submit-button', 'Add the ID of \"submit-button\" to your the <code>button</code> on your <code>form</code> element.')",
|
|
"assert($('#submit-button') && $('#submit-button').prop('disabled'), 'Disable your element with the id of \"submit-button\".')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed708826",
|
|
"name": "Waypoint: Remove an Element Using jQuery",
|
|
"dashedName": "waypoint-remove-an-element-using-jquery",
|
|
"difficulty": 0.078,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
"assert($('img').length === 0, 'Use jQuery to remove your <code>img</code> element from your page.')",
|
|
"assert(editor.match(/<img/g), 'You should still have an <code>img</code> element in your HTML but jQuery should remove it.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed608826",
|
|
"name": "Waypoint: Use appendTo to Move Elements with jQuery",
|
|
"dashedName": "waypoint-use-appendto-to-move-elements-with-jquery",
|
|
"difficulty": 0.079,
|
|
"description": [
|
|
"$('.btn').appendTo('#right-well')"
|
|
],
|
|
"tests": [
|
|
"assert($('#left-well').children().length === 0, 'Your left well should not have any buttons inside it.')",
|
|
"assert($('#right-well').children().length === 6, 'Your right well should have all 6 buttons inside it.')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed508826",
|
|
"name": "Waypoint: Clone an Element Using jQuery",
|
|
"dashedName": "waypoint-clone-an-element-using-jquery",
|
|
"difficulty": 0.080,
|
|
"description": [
|
|
"Clone the #target1 element and append it to the #left-well element. $('#target1').clone().appendTo('#left-well')"
|
|
],
|
|
"tests": [
|
|
"assert($('#left-well').children().length > 3, 'You should have at least 4 button elements in your #left-well element')"
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed308826",
|
|
"name": "Waypoint: Target the Parent of an Element Using jQuery",
|
|
"dashedName": "waypoint-target-the-parent-of-an-element-using-jquery",
|
|
"difficulty": 0.082,
|
|
"description": [
|
|
"Change the parent of the #target1 element to have the background color of red.",
|
|
"$('#target1').parent().css('background-color', 'red')"
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed208826",
|
|
"name": "Waypoint: Target the Children of an Element Using jQuery",
|
|
"dashedName": "waypoint-target-the-children-of-an-element-using-jquery",
|
|
"difficulty": 0.083,
|
|
"description": [
|
|
"Change the color of all the #left-well element's children to blue.",
|
|
"$('#right-well').children().css('background-color', 'blue')"
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<div class='row'>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#left-well</h4>",
|
|
" <div class='well' id='left-well'>",
|
|
" <button class='btn btn-default target' id='target1'>#target1</button>",
|
|
" <button class='btn btn-default target' id='target2'>#target2</button>",
|
|
" <button class='btn btn-default target' id='target3'>#target3</button>",
|
|
" </div>",
|
|
" </div>",
|
|
" <div class='col-xs-6'>",
|
|
" <h4>#right-well</h4>",
|
|
" <div class='well' id='right-well'>",
|
|
" <button class='btn btn-default target' id='target4'>#target4</button>",
|
|
" <button class='btn btn-default target' id='target5'>#target5</button>",
|
|
" <button class='btn btn-default target' id='target6'>#target6</button>",
|
|
" </div>",
|
|
" </div>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed108826",
|
|
"name": "Waypoint: Target a Specific Child of an Element Using jQuery",
|
|
"dashedName": "waypoint-target-a-specific-child-of-an-element-using-jquery",
|
|
"difficulty": 0.084,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aed008826",
|
|
"name": "Waypoint: Target Even Numbered Elements Using jQuery",
|
|
"dashedName": "waypoint-target-even-numbered-elements-using-jquery",
|
|
"difficulty": 0.085,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aecc08826",
|
|
"name": "Waypoint: Read Data from an Element Using jQuery",
|
|
"dashedName": "Waypoint-read-data-from-an-element-using-jquery",
|
|
"difficulty": 0.086,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9aebc08826",
|
|
"name": "Waypoint: Get Data from an URL Using jQuery",
|
|
"dashedName": "waypoint-get-data-from-a-url-using-jquery",
|
|
"difficulty": 0.087,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9ae9c08826",
|
|
"name": "Waypoint: Loop through JSON Data Using jQuery",
|
|
"dashedName": "waypoint-loop-through-json-data-using-jquery",
|
|
"difficulty": 0.088,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
|
|
{
|
|
"id": "bad87fee1348bd9ae8c08826",
|
|
"name": "Waypoint: Setup Click Events Using jQuery",
|
|
"dashedName": "waypoint-setup-click-events-using-jquery",
|
|
"difficulty": 0.089,
|
|
"description": [
|
|
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" $(document).ready(function() {",
|
|
"",
|
|
" });",
|
|
"fcces",
|
|
"<!-- You shouldn't need to modify code below this line -->",
|
|
"<button id='count-presses-button' class='btn btn-primary btn-block btn-lg>Press me</button>",
|
|
"<span id='times-pressed'>"
|
|
],
|
|
"challengeType": 0
|
|
},
|
|
{
|
|
"id": "bad88fee1348bd9ae8c08826",
|
|
"name": "Waypoint: Wire AJAX Call into a jQuery Click Event",
|
|
"dashedName": "waypoint-wire-ajax-call-into-a-jquery-click-event",
|
|
"difficulty": 0.089,
|
|
"description": [
|
|
"<img src='https://www.evernote.com/l/AjmAQ5BxGrFGRrWl_j2eSpGZMfrunfse89gB/image.png'>"
|
|
],
|
|
"tests": [
|
|
|
|
],
|
|
"challengeSeed": [
|
|
"fccss",
|
|
" var random = function() { return Math.floor(Math.random() * 3) }",
|
|
" $(document).ready(function() {",
|
|
"<!-- Don't change code above this line -->",
|
|
"",
|
|
" $('#cat-button').on('click', function() {",
|
|
" $.getJSON('/json/cats.json', function( json ) {",
|
|
" var kitten = json[random()];",
|
|
" $(\"<img src='\" + kitten.imageLink + \"'>\").appendTo('#output');",
|
|
" $(\"<h3>Code name: \" + kitten.codeNames[random()] + \"</h3>\").appendTo('#output');",
|
|
" });",
|
|
" });",
|
|
"",
|
|
"<!-- Don't change code below this line -->",
|
|
" });",
|
|
"fcces",
|
|
"<button id='cat-button' class='btn btn-primary btn-block btn-lg'>Cat Button</button>",
|
|
"<div class='jumbotron' id='output'>",
|
|
"</div>"
|
|
],
|
|
"challengeType": 0
|
|
}
|
|
]
|
|
}
|