Changing the class of the html document using jQuery

Question

I am new to jQuery. I need to add a class called "success" to every paragraph in divClass when button btnClassPSuccess is clicked. My HTML code is :-

<div id="divClass">
  <p>A</p>
  <p>B</p>
  <p>C</p>
  <p>D</p>
  <p>E</p>
  <p>F</p>
  <p>G</p>
</div>
<button id="btnClassPSuccess">Change Paragraphs to Success</button>

My jQuery code is :-

$("#btnClassPSuccess").click(function () {
  $('#divClass').addClass("sucess");
});

Can you please correct me how to do this.

Try this to add class on all paragraph inside a div $("#divClass p").addClass("succcess") — Braj
– Braj, Commented Mar 26, 2018 at 2:00

j08691 · Accepted Answer · 2018-03-26 01:53:33Z

2

You'd do it like:

$("#btnClassPSuccess").click(function () {
    $('#divClass p').addClass("success");
});

Example:

$("#btnClassPSuccess").click(function() {
  $('#divClass').addClass("success");
});

.success {
  background: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divClass">
  <p>A</p>
  <p>B</p>
  <p>C</p>
  <p>D</p>
  <p>E</p>
  <p>F</p>
  <p>G</p>
</div>
<button id="btnClassPSuccess">Change Paragraphs to Success</button>

answered Mar 26, 2018 at 1:53

j08691

208k33 gold badges269 silver badges281 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vishal Taj PM · Accepted Answer · 2018-03-26 03:03:41Z

0

$("#btnClassPSuccess").click(function () {
  $('#divClass p').addClass("success");
});

.success{
 background: lightgreen;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divClass">
 <p>A</p>
 <p>B</p>
 <p>C</p>
 <p>D</p>
 <p>E</p>
 <p>F</p>
 <p>G</p>
</div>
<button id="btnClassPSuccess">Change Paragraphs to Success</button>

I see your edit now:

$("#btnClassPSuccess").click(function () {
  $('#divClass p').addClass("success");
});

try it

edited Mar 26, 2018 at 3:03

Vishal Taj PM

1,35911 silver badges23 bronze badges

answered Mar 26, 2018 at 1:53

Scaramouche

3,2574 gold badges23 silver badges53 bronze badges

Collectives™ on Stack Overflow

Changing the class of the html document using jQuery

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related