From e2907620059b0dad91c2616345e8712ee256c622 Mon Sep 17 00:00:00 2001
From: Garret Kemp <34540202+GarretKemp@users.noreply.github.com>
Date: Sat, 9 Mar 2019 07:06:17 +0900
Subject: [PATCH] Provided code solution to jQuery challenge : Change the CSS
 of an Element Using jQuery (#35293)

* Update index.md

* Update index.md
---
 .../index.md                                  | 39 +++++++++++++++++--
 1 file changed, 36 insertions(+), 3 deletions(-)

diff --git a/guide/english/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md b/guide/english/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
index a179049830..b6276e8371 100644
--- a/guide/english/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
+++ b/guide/english/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
@@ -3,8 +3,41 @@ title: Change the CSS of an Element Using jQuery
 ---
 ## Change the CSS of an Element Using jQuery
 
-This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.
+ - You can edit the CSS of an element using jQuery with the .css() function.
+ - In this example, it allows you to change the text color in the element with an id of "#target1".
+ 
+```html
+<script>
+  $(document).ready(function() {
+    $("button").addClass("animated bounce");
+    $(".well").addClass("animated shake");
+    $("#target3").addClass("animated fadeOut");
+    $("button").removeClass("btn-default");
+    $("#target1").css("color", "red"); // Selects the element with an id of #target1 and changes its text color to red
+  });
+</script>
 
-<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>.
+<!-- Only change code above this line. -->
 
-<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds  -->
+<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>
+```