Can Someone Explain Why Target the same element with multiple jQuery Selectors, jQuery isn't going through?

Can Someone Explain Why Target the same element with multiple jQuery Selectors, jQuery isn't going through?
0

#1

I can’t complete this lesson on why target the same element with multiple J-Query selectors. I thought I did it right, but it isn’t allowing me to pass. I thought that I added one class for each, but it still marks me wrong for that question. I got the blue button, it shakes.

If anyone can help, I would really appreciate it.
Thanks!

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

#2

Technically, your code does what it is supposed to do. Right or wrong, the test you are failing is not expecting there to be a space between addClass and ( for each of the lines.

These html, css, and jQuery tests are fairly restrictive and probably should be written to accommodate spaces, because the spaces technically do not affect the execution of the code (as you could see).

Thanks for letting us know about this slight bug. For now, just remove the space and you will pass.


#3

Hi Randell!

Thanks for helping me. I just eliminated that space and it still won’t let me pass. Any suggestions? I was hoping to move on. But this lesson won’t let me.

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

</p>

#4

If the above is your code, then I still see spaces between .addClass and ( for each line.


#5

You are my hero, Randell. I didn’t think of those spaces. I passed. Thank you very much.