diff --git a/seed/challenges/jquery-ajax-and-json.json b/seed/challenges/jquery-ajax-and-json.json index c7689d19b48..7ff521df72d 100644 --- a/seed/challenges/jquery-ajax-and-json.json +++ b/seed/challenges/jquery-ajax-and-json.json @@ -514,15 +514,22 @@ "dashedName": "waypoint-use-appendto-to-move-elements-with-jquery", "difficulty": 0.079, "description": [ - "$('.btn').appendTo('#right-well')" + "Now let's try moving elements from one div to another.", + "jQuery has a function called appendTo() that allows you to select HTML elements and append them to another element.", + "For example, if we wanted to move \"target4\" from our right well to our left well, we would use $('#target4').appendTo('#left-well');", + "Move your \"target2\" element from your \"left-well\" to your \"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.')" + "assert($('#left-well').children('#target2').length === 0, 'Your \"target2\" element should not be inside your \"left-well\".')", + "assert($('#right-well').children('#target2').length > 0, 'Your \"target2\" element should be inside your \"right-well\".')", + "assert(!editor.match(/class.*animated/g), 'Only use jQuery to move these elements.')" ], "challengeSeed": [ "fccss", " $(document).ready(function() {", + " $('#target1').css('color', 'red');", + " $('#target1').prop('disabled', true);", + " $('#target4').remove();", "", " });", "fcces", @@ -560,14 +567,24 @@ "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')" + "In addition to moving elements, you can also copy them from one place to another.", + "jQuery has a function called clone() that makes a copy of an element.", + "For example, if we wanted to copy \"target2\" from our \"left-well\" to our \"right-well\", we would use $('#target2').clone().appendTo('#right-well');", + "Did you notice this involves sticking two jQuery functions together? This is called \"function chaining\" and it's a really convenient way to get things done with jQuery.", + "Clone your \"target5\" element and append it to your \"left-well\"." ], "tests": [ - "assert($('#left-well').children().length > 3, 'You should have at least 4 button elements in your #left-well element')" + "assert($('#right-well').children('#target5').length > 0, 'Your \"target5\" element should be inside your \"right-well\".')", + "assert($('#left-well').children('#target5').length > 0, 'A copy of your \"target5\" element should also be inside your \"left-well\".')", + "assert(!editor.match(/class.*animated/g), 'Only use jQuery to move these elements.')" ], "challengeSeed": [ "fccss", " $(document).ready(function() {", + " $('#target1').css('color', 'red');", + " $('#target1').prop('disabled', true);", + " $('#target4').remove();", + " $('#target2').appendTo('#right-well');", "", " });", "fcces",