$("button")
, by class: $(".btn")
, and by id $("#target1")
.
Although it is possible to add multiple classes in a single .addClass()
call, let's add them to the same element in three separate ways.
Using .addClass()
, add only one class at a time to the same element, three different ways:
Add the animated
class to all elements with type button
.
Add the shake
class to all the buttons with class .btn
.
Add the btn-primary
class to the button with id #target1
.
Noteshake
, animated
, and btn-primary
to #target1
.
$("button")
selector.
testString: assert(code.match(/\$\s*?\(\s*?(?:'|")\s*?button\s*?(?:'|")/gi), 'Use the $("button")
selector.');
- text: Use the $(".btn")
selector.
testString: assert(code.match(/\$\s*?\(\s*?(?:'|")\s*?\.btn\s*?(?:'|")/gi), 'Use the $(".btn")
selector.');
- text: Use the $("#target1")
selector.
testString: assert(code.match(/\$\s*?\(\s*?(?:'|")\s*?#target1\s*?(?:'|")/gi), 'Use the $("#target1")
selector.');
- text: Only add one class with each of your three selectors.
testString: assert(code.match(/addClass/g) && code.match(/addClass\s*?\(\s*?('|")\s*?[\w-]+\s*?\1\s*?\)/g).length > 2, 'Only add one class with each of your three selectors.');
- text: Your #target1
element should have the classes animated
shake
and btn-primary
.
testString: assert($('#target1').hasClass('animated') && $('#target1').hasClass('shake') && $('#target1').hasClass('btn-primary'), 'Your #target1
element should have the classes animated
shake
and btn-primary
.');
- text: Only use jQuery to add these classes to the element.
testString: 'assert(!code.match(/class.*animated/g), "Only use jQuery to add these classes to the element.");'
```