Change Text Inside an Element Using jQuery 5

JavaScript
1

Tell us what’s happening:
Having a bit of trouble figuring this one out. I’ve been trying to look at forums for it, but cannot figure out what I’m doing wrong. What is it that I’m doing wrong to keep getting errors?

Your code so far


<script>
  $(document).ready(function() {
    $("#target1").css("color", "red");
    $("h4").html("<em>#target4</em>");
    
  });
</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; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36 Avast/73.0.1258.87.

Link to the challenge:

2

You’re selecting the wrong element. You should be selecting the element with id target4 not h4 element.

3

I changed it, but my code still came out wrong. Here’s what it is now:

<script>

$(document).ready(function() {

$(“#target1”).css(“color”, “red”);

$(“target4”).html(“<em>#left-well</em>”);

});

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

4 
 $(document).ready(function() {
    $("#target1").css("color", "red");
   $("#target4").html("<em>#target</em>");
    
  });
```you just forgot to put a # tag before "left-well" because it searches for an element in your case <target4> which is not present.
5

I keep getting an error on it, though. I put the # tag on there, but it just keeps coming up as an error.

6 
<script>
  $(document).ready(function() {
    $("#target1").css("color","red");
   $("#target4").html("<em>#target4</em>");
    
  });
</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>[quote="LBDemaree, post:5, topic:271207, full:true"]
I keep getting an error on it, though. I put the # tag on there, but it just keeps coming up as an error.
[/quote]


</div>
7

Thank you so much. I don’t know how I kept getting that wrong. Maybe I kept forgetting to spell target correctly or forgot to add the 4 in it.