Merge pull request #1617 from ahstro/target-elements

Improves 'Target Elements by ID Using jQuery'
pull/18182/head
Quincy Larson 2015-08-12 00:55:20 -07:00
commit b87f8f0234
1 changed files with 9 additions and 7 deletions

View File

@ -149,15 +149,17 @@
"title": "Target Elements by ID Using jQuery",
"difficulty": 3.04,
"description": [
"You can also target elements by their id attributes.",
"First target your <code>div</code> element with the class \"target3\" by using the <code>$('#target3')</code> selector.",
"Note that, just like with CSS declarations, you type a <code>#</code> before the class's name.",
"Then use jQuery's <code>.addClass()</code> function to add the classes \"animated\" and \"fadeOut\".",
"Make all the <code>button</code> element with the id \"target3\" fadeOut. <code>$('#target3').addClass('animated fadeOut')</code>."
"Just like you can target elements by their classes, you can also target them by their id attributes.",
"First target the element with the id <code>target3</code> by using the <code>$('#target3')</code> selector.",
"Note that, just like with CSS selectors, you type a <code>#</code> before the id's name.",
"Then use jQuery's <code>.addClass()</code> function to add the class <code>fadeOut</code>.",
"Since <code>#target3</code> is a <code>button</code>, and we already added the <code>animated</code>-class to all <code>button</code>-elements, we do not need to add it again.",
"Make all the elements with the id <code>target3</code> fade out. <code>$('#target3').addClass('fadeOut')</code>."
],
"tests": [
"assert($('#target3').hasClass('animated') && $('#target3').hasClass('fadeOut'), '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 \"fadeOut\".');",
"assert(!editor.match(/class.*animated/g), 'Only use jQuery to add these classes to the element.');"
"assert($('#target3').hasClass('animated'), 'Make sure the old <code>animated</code>-class is still added to all buttons.')",
"assert($('#target3').hasClass('fadeOut'), 'Target the element with the id <code>target3</code> and use the jQuery <code>addClass()</code> function to give it the class <code>fadeOut</code>.')",
"assert(!editor.match(/class.*animated/g), 'Only use jQuery to add these classes to the element.')"
],
"challengeSeed": [
"fccss",