katiebvogel / jquery-assessment

Here is a simple jquery app that uses data, .attr(), and .css() methods

jQuery Assessment

For this assessment, you will be creating a simple application. When the page loads, it should have a button already on the DOM that reads "Click me". When that button is clicked, it should create a new div that contains some text, and two buttons. It should have a data attribute called 'data-button-toggle' and set that value equal to 1. In a CSS file, target a class that changes the background color of the div to green.

The Text in the new div should read "Here are the number of clicks: ", then have a number that represents how many times the "Click me" button has been clicked.

The first button in the div should have the text "Change color". When clicking on it, it should change the parent divs background color to red. This will require you looking up the .css() method in the jQuery documentation if you do not already know how to use it. Once you do that, target the data attribute you created in the div and set it equal to 2. Now, when you click this button again, check to see if the value is 2, if it is, set the data attribute equal to 1 and set the background color of the div back to green. Basically, the button should toggle the background color between green and red. This link will help you understand the .data() method of jquery better, thus helping you with the challenge: (https://api.jquery.com/data/)

The second button in the div should have the text "Remove". When clicking it, it should remove the parent div from the DOM using the .remove() method.

Do not worry about altering the button click count based on the amount of divs you remove. No other styling of 'extras' are needed for this challenge, in fact, please don't add any additional work. Once you are complete, check your work into a new repo on your GitHub account with the repo name of 'jquery_assessment'.

If there are any things in this assessment that you cannot complete, that is fine! Just complete what you can. This is all about knowing how to help you best.

You need not check this repo with this readme out and mess with git. Go ahead and just start a new repo, with new files and work out of that.