jQuery - Target the Same Element with Multiple jQuery Selectors

[Winnerr]

Tell us what’s happening:
Describe your issue in detail here.
im having problems passing the fourth and fifth stage

  **Your code so far**

<script>
$(document).ready(function() {
$("button")
$(".btn")
$("#target1")
});
</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>

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36

Challenge: jQuery - Target the Same Element with Multiple jQuery Selectors

Link to the challenge:

freeCodeCamp.org

[kevinSmith]

Those selectors all have methods attached to them, including addClass. So, if I had an element with an id of “foo” and I wanted to add the class of “bar”, I would do:

$("#foo").addClass("bar");

The $("#foo") selects the element, and then on that I apply the method addClass("bar").

That’s similar to what you need to do.

[Winnerr]

i have done that but still the fourth stage is not still passing

[lasjorg]

@Winnerr Post your code so we can see it.

[Winnerr]

<script>
  $(document).ready(function() {
    $("button").addClass("animated bounce");
    $(".well").addClass("animated shake");
    $("#target3").addClass("animated fadeOut");
    $("button").removeClass("btn-default");

  });
</script>

[kevinSmith]

The instructions are:

Add the animated class to all elements with type button.

Add the shake class to all the buttons with class .btn.

Add the btn-primary class to the button with id #target1.

I don’t see where you have done that.

Your first line:

$("button").addClass("animated bounce");

You are adding to button elements, but you are adding two classes, “animated” and “bounce”. Where were you told to add that second class?

For the second instruction, I guess you have this:

$(".well").addClass("animated shake");

That isn’t the right class to target (“.well”?) and again, you were only told to add one class.

For the last, you have:

$("#target3").addClass("animated fadeOut");

Again, not the right target and only add the class you were told to add.

I’m not sure about the last line, why you are trying to remove a class. When were you told to do that?

---

You have to read the instructions very carefully and follow them very carefully. Don’t do anything you were not told to do. I know that sounds strict, but computers are very picky and really, in a professional setting, making as few changes as needed is often a good idea.