{"id":19795264,"url":"https://github.com/kpwithcode/jquery-drills","last_synced_at":"2026-06-08T13:31:47.803Z","repository":{"id":101881875,"uuid":"158292537","full_name":"KPWithCode/JQuery-Drills","owner":"KPWithCode","description":"JQuery Drills","archived":false,"fork":false,"pushed_at":"2018-11-26T04:30:48.000Z","size":8,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-28T16:07:24.360Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/KPWithCode.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-11-19T21:29:53.000Z","updated_at":"2018-11-26T04:30:50.000Z","dependencies_parsed_at":null,"dependency_job_id":"9e48db2a-2a51-4598-b93f-b71285cf5374","html_url":"https://github.com/KPWithCode/JQuery-Drills","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/KPWithCode/JQuery-Drills","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KPWithCode%2FJQuery-Drills","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KPWithCode%2FJQuery-Drills/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KPWithCode%2FJQuery-Drills/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KPWithCode%2FJQuery-Drills/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/KPWithCode","download_url":"https://codeload.github.com/KPWithCode/JQuery-Drills/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KPWithCode%2FJQuery-Drills/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34065349,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-08T02:00:07.615Z","response_time":111,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-12T07:15:52.898Z","updated_at":"2026-06-08T13:31:47.785Z","avatar_url":"https://github.com/KPWithCode.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# JQuery-Drills\n## Tasks\nIn app.js, make sure all the HTML has loaded before using jQuery. (hint)\nCreate an \u003cinput\u003e with a type=\"submit\", id=\"btnSubmit\", and value=\"Submit\" in the index.html. Open the index.html in a browser and verify that a button appears.\nIn app.js and use jQuery to select the \u003cinput\u003e element you just created by the id.\nAdd a click event handler to the \u003cinput\u003e button that will alert a message in the browser when the button is clicked. (hint)\nIn the index.html, create a \u003cform\u003e element with an \u003cinput type=\"text\"\u003e field and the \u003cinput type=\"submit\"\u003e you already created.\nIn app.js when the form is submitted, alert the value of the text input field. (hint) (hint)\nIf the user has typed in the input field then the button should be enabled, otherwise the button should be disabled. (hint)\nCreate a div element and append it to the body.\nWhen the user types in the input field and clicks submit, append the text in an h2 element to the div\nWhen the user mouses over the h2 element, assign it a new background color and border radius. (hint)\nGreat job! Now, delete the code for creating the h2 and we are going to work on creating a list\nUse jQuery to create an unordered list and append it to the body\nWhen the user submits the form, append the text as list item to the unordered list\nWhen the user clicks on the li element, assign it a random color.\nWhen the user double clicks on the list, remove the item that was clicked on. (hint)\n## Hints\njQuery on method: http://api.jquery.com/on/\njQuery click method: https://api.jquery.com/click/\nMath.random() can be used to generate a random number\nRGB colors range from rgb(0, 0, 0) for black to rgb(255, 255, 255) for white\nYou will want to generate 3 random numbers between 0 and 255 and set the RGB values using jQuery","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkpwithcode%2Fjquery-drills","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkpwithcode%2Fjquery-drills","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkpwithcode%2Fjquery-drills/lists"}