Freecodecamp: I need to apply bounce property on both left and right well's using nth-child... I m not getting it.

[jpathan]

Challenge Target a Specific Child of an Element Using jQuery has an issue.
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.106 Safari/537.36.
Please describe how to reproduce this issue, and include links to screenshots if possible.

My code:

<script>
  $(document).ready(function() {
    $("#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");
    $("#right-well").children().css("color", "orange");
    $("#left-well:nth-child(1)").addClass("animated bounce");
  });
</script>

<!-- Only change code above this line. -->

<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>

[clothesclothes439]

that is very good, thanks

[abhisekp]

@jpathan

The Instruction

Make the second child in each of your well elements bounce.
You must target the children of element with the target class.

i.e. you must target the target class and only select the 2nd of the target class.

---

Please verify with the community in room before filing an issue.

[jpathan]

Thank you so much…I got it

On Jul 9, 2016, at 1:45 PM, Abhisek Pattnaik [email protected] wrote:

@jpathan https://github.com/jpathan
The Instruction

Make the second child in each of your well elements bounce.
You must target the children of element with the target class.

i.e. you must target the target class and only select the 2nd of the target class.

Please verify with the community in https://gitter.im/FreeCodeCamp/Help room before filing an issue.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub https://github.com/FreeCodeCamp/FreeCodeCamp/issues/9641#issuecomment-231546399, or mute the thread https://github.com/notifications/unsubscribe/AMngZMgUwJ3KdbA-cn2ygn2odPf8LS0Kks5qT95HgaJpZM4JIomj.

[akorede12]

how did you get it, I'm confused

[fuecisla]

@akorede12 You did not get it because it is not well explained, at all. It is not intuitive. We are supposed to "Target a Specific Child of an Element Using jQuery" so obviously you would be expecting to point to one element and then to its child. However the example tells you to do something different:

Make the second child in each of your well elements bounce. You must target the children of elements with the target class.

If you follow their instructions you are NOT targeting a specific child (nth-child) of a single element you are targeting the nth-child of ALL the elements that have children of a given class (the class target). How can you target the nth child of a parent element?? No idea (my guess is by using the id).

I think that the example is to blame, but only partially. JS is not so intuitive because:

1. You would expect to find the children by a reference to who are their parents (their name or at least the parents class).
2. However, at least in this example, JS only uses the parents to identify find second child.

In other words, this example does not teach you to find the second boy of all the parents called "Smith" or of an specific family. It shows you to find _the second blond boy of all the families that have blond boys_.

Please, let me know if I am wrong or misunderstood what your problem was with this challenge.

[akorede12]

Thank you, I've already figured it out, but still thanks

On Wednesday, 3 August 2016, Borja [email protected] wrote:

@akorede12 You did not get it because it is not well explained, at all.
It is not intuitive. We are supposed to "Target a Specific Child of an
Element Using jQuery" so obviously you would be expecting to point to one
element and then to its child. However the example tells you to do
something different:

Make the second child in each of your well elements bounce. You must
target the children of elements with the target class.

If you follow their instructions you are NOT targeting a specific child
(nth-child) of a single element you are targeting the nth-child of ALL the
elements that have children of a given class (the class target). How can
you target the nth child of a parent element?? No idea (my guess is by
using the id).

I think that the example is to blame, but only partially. JS is not so
intuitive because:

1. You would expect to find the children by a reference to who are their
   parents (their name or at least the parents class).
2. However, at least in this example, JS only uses the parents to
   identify find second child.

In other words, this example does not teach you to find the second boy of
all the parents called "Smith" or of an specific family. It shows you to
find the second blond boy of all the families that have blond boys.

Please, let me know if I am wrong or misunderstood what your problem was
with this challenge.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or mute the thread.<
https://ci3.googleusercontent.com/proxy/ZiA5mmBxCCq91ELF6DJw1ztSA-ULZT6rPjDazpCS80lXkt2_D3oUetVrBmriKjCU_UFICtkj8fOEHqsaNTnDREAy0-VNYZG5K8mi6qwGqzBUJJgczSm4eCksfEFQfTkwpsPr1DItHcRgAG_0iA-LJm2tKySeeQ=s0-d-e1-ft#https://github.com/notifications/beacon/ATaXte9hO13qZtrpYYf48FD8rhap9RWTks5qcK_AgaJpZM4JIomj.gif>