From 058db4f44994140837780d4e3ecf0b4e6e72441f Mon Sep 17 00:00:00 2001
From: The Coding Aviator <34807532+thecodingaviator@users.noreply.github.com>
Date: Sat, 9 Mar 2019 03:34:01 +0530
Subject: [PATCH] fix(guide): Add full solution code to jQuery challenges
 (#35488)

---
 .../index.md                                  |  2 --
 .../front-end-libraries/jquery/index.md       | 10 +++---
 .../index.md                                  |  2 --
 .../index.md                                  | 22 ++++++++++++
 .../index.md                                  | 25 ++++++++++++-
 .../index.md                                  | 36 +++++++++++++++----
 .../index.md                                  | 33 +++++++++++++++--
 .../index.md                                  | 28 +++++++++++++--
 8 files changed, 135 insertions(+), 23 deletions(-)

diff --git a/guide/english/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
index 2d175a7177..aebd504255 100644
--- a/guide/english/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
@@ -13,8 +13,6 @@ title: Change Text Inside an Element Using jQuery
   });
 </script>
 
-<!-- Only change code above this line. -->
-
 <div class="container-fluid">
   <h3 class="text-primary text-center">jQuery Playground</h3>
   <div class="row">
diff --git a/guide/english/certifications/front-end-libraries/jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/index.md
index 8b3fdacfb9..3efc05ced2 100644
--- a/guide/english/certifications/front-end-libraries/jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/index.md
@@ -3,11 +3,9 @@ title: jQuery
 ---
 ## jQuery
 
-This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
-
-<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.
-
-<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds  -->
+jQuery is a JavaScript library which is popularly used for JavaScript DOM manipulation, CSS handling and Ajax.
 
 #### More Information:
-<!-- Please add any articles you think might be helpful to read before writing the article -->
+
+- [jQuery Website](https://jquery.com/)
+- [jQuery | Wikipedia](https://en.wikipedia.org/wiki/JQuery)
\ No newline at end of file
diff --git a/guide/english/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
index 15d9916c58..ff593c3a4d 100644
--- a/guide/english/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
@@ -15,8 +15,6 @@ title: Remove Classes from an Element with jQuery
   });
 </script>
 
-<!-- Only change code above this line. -->
-
 <div class="container-fluid">
   <h3 class="text-primary text-center">jQuery Playground</h3>
   <div class="row">
diff --git a/guide/english/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
index 3ca3c85c7b..c6c07d9bc2 100644
--- a/guide/english/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
@@ -14,4 +14,26 @@ title: Target Elements by Class Using jQuery
     $(".well").addClass("shake");
   });
 </script>
+
+<div class="container-fluid">
+  <h3 class="text-primary text-center">jQuery Playground</h3>
+  <div class="row">
+    <div class="col-xs-6">
+      <h4>#left-well</h4>
+      <div class="well" id="left-well">
+        <button class="btn btn-default target" id="target1">#target1</button>
+        <button class="btn btn-default target" id="target2">#target2</button>
+        <button class="btn btn-default target" id="target3">#target3</button>
+      </div>
+    </div>
+    <div class="col-xs-6">
+      <h4>#right-well</h4>
+      <div class="well" id="right-well">
+        <button class="btn btn-default target" id="target4">#target4</button>
+        <button class="btn btn-default target" id="target5">#target5</button>
+        <button class="btn btn-default target" id="target6">#target6</button>
+      </div>
+    </div>
+  </div>
+</div>
 ```
diff --git a/guide/english/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
index 6c3429cca5..e45f843c68 100644
--- a/guide/english/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
@@ -9,7 +9,30 @@ title: Target Elements by id Using jQuery
   $(document).ready(function() {
     $("button").addClass("animated bounce");
     $(".well").addClass("animated shake");
-    $("#target3").addClass("fadeOut"); // Target elements with the id "target3" and add the class "fadeOut" to them.
+    $("#target3").addClass("fadeOut");
   });
 </script>
+
+<div class="container-fluid">
+  <h3 class="text-primary text-center">jQuery Playground</h3>
+  <div class="row">
+    <div class="col-xs-6">
+      <h4>#left-well</h4>
+      <div class="well" id="left-well">
+        <button class="btn btn-default target" id="target1">#target1</button>
+        <button class="btn btn-default target" id="target2">#target2</button>
+        <button class="btn btn-default target" id="target3">#target3</button>
+      </div>
+    </div>
+    <div class="col-xs-6">
+      <h4>#right-well</h4>
+      <div class="well" id="right-well">
+        <button class="btn btn-default target" id="target4">#target4</button>
+        <button class="btn btn-default target" id="target5">#target5</button>
+        <button class="btn btn-default target" id="target6">#target6</button>
+      </div>
+    </div>
+  </div>
+</div>
+
 ```
diff --git a/guide/english/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
index 1c967bf81e..b653ff97da 100644
--- a/guide/english/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
@@ -8,10 +8,10 @@ title: Target HTML Elements with Selectors Using jQuery
 ## Example
 ```js
 //You can select all <p> elements on a page like this  =  $("p")
-  $(document).ready(function(){
-    $("button").click(function(){
-        $("p").hide();
-    });
+$(document).ready(function(){
+  $("button").click(function(){
+    $("p").hide();
+  });
 });
 ```
 
@@ -19,8 +19,30 @@ title: Target HTML Elements with Selectors Using jQuery
 ## Solution
 ```html
 <script>
-  $(document).ready(function() {
-      $("button").addClass("animated bounce"); // We are selecting the button elements and adding "animated bounce" class to them.
+  $(document).ready(function(){
+    $("button").addClass("animated bounce");
   });
 </script>
-```
+
+<div class="container-fluid">
+  <h3 class="text-primary text-center">jQuery Playground</h3>
+  <div class="row">
+    <div class="col-xs-6">
+      <h4>#left-well</h4>
+      <div class="well" id="left-well">
+        <button class="btn btn-default target" id="target1">#target1</button>
+        <button class="btn btn-default target" id="target2">#target2</button>
+        <button class="btn btn-default target" id="target3">#target3</button>
+      </div>
+    </div>
+    <div class="col-xs-6">
+      <h4>#right-well</h4>
+      <div class="well" id="right-well">
+        <button class="btn btn-default target" id="target4">#target4</button>
+        <button class="btn btn-default target" id="target5">#target5</button>
+        <button class="btn btn-default target" id="target6">#target6</button>
+      </div>
+    </div>
+  </div>
+</div>
+```
\ No newline at end of file
diff --git a/guide/english/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
index 8d37518602..039f177c0e 100644
--- a/guide/english/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
@@ -8,7 +8,36 @@ title: Target the Parent of an Element Using jQuery
 ```html
 <script>
   $(document).ready(function() {
-    $("#target1").parent().css("background-color", "red"); // Selects the parent of #target1 and changes its background-color to red
+    $("#target1").css("color", "red");
+    $("#target1").prop("disabled", true);
+    $("#target4").remove();
+    $("#target2").appendTo("#right-well");
+    $("#target5").clone().appendTo("#left-well");
+    $("#target1").parent().css("background-color", "red");
   });
 </script>
-```
+
+<body>
+  <div class="container-fluid">
+    <h3 class="text-primary text-center">jQuery Playground</h3>
+    <div class="row">
+      <div class="col-xs-6">
+        <h4>#left-well</h4>
+        <div class="well" id="left-well">
+          <button class="btn btn-default target" id="target1">#target1</button>
+          <button class="btn btn-default target" id="target2">#target2</button>
+          <button class="btn btn-default target" id="target3">#target3</button>
+        </div>
+      </div>
+      <div class="col-xs-6">
+        <h4>#right-well</h4>
+        <div class="well" id="right-well">
+          <button class="btn btn-default target" id="target4">#target4</button>
+          <button class="btn btn-default target" id="target5">#target5</button>
+          <button class="btn btn-default target" id="target6">#target6</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+```
\ No newline at end of file
diff --git a/guide/english/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md b/guide/english/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
index e194b58769..cada78addf 100644
--- a/guide/english/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
@@ -7,9 +7,31 @@ title: Target the Same Element with Multiple jQuery Selectors
 ```html
 <script>
   $(document).ready(function() {
-    $("button").addClass("animated"); // Target elements with type "button" and add the class "animated" to them.
-    $(".btn").addClass("shake"); // Target elements with class ".btn" and add the class "shake" to them.
-    $("#target1").addClass("btn-primary"); // Target elements with id "#target1" and add the class "btn-primary" to them.
+    $("button").addClass("animated");
+    $(".btn").addClass("shake");
+    $("#target1").addClass("btn-primary");
   });
 </script>
+
+<div class="container-fluid">
+  <h3 class="text-primary text-center">jQuery Playground</h3>
+  <div class="row">
+    <div class="col-xs-6">
+      <h4>#left-well</h4>
+      <div class="well" id="left-well">
+        <button class="btn btn-default target" id="target1">#target1</button>
+        <button class="btn btn-default target" id="target2">#target2</button>
+        <button class="btn btn-default target" id="target3">#target3</button>
+      </div>
+    </div>
+    <div class="col-xs-6">
+      <h4>#right-well</h4>
+      <div class="well" id="right-well">
+        <button class="btn btn-default target" id="target4">#target4</button>
+        <button class="btn btn-default target" id="target5">#target5</button>
+        <button class="btn btn-default target" id="target6">#target6</button>
+      </div>
+    </div>
+  </div>
+</div>
 ```