CODEWITHSUNDEEP
jquery
nFnK
nFnK

Reputation: 21

How can I change class name in jquery

How can I change all class name a time in jquery. thanks for helpful. For Example:

$('.myclass').removeClass("name-*");
$('.myclass').addClass("name-999");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="myclass name-212"></div>
<div class="myclass name-545"></div>
<div class="myclass name-767"></div>

Upvotes: 1

Views: 90

Answers (3)

Mihai T
Mihai T

Reputation: 17697

Well if you know/want the divs to have myclass name-999 why don't you remove all the classes and add what you want ?

$('.myclass').removeClass().addClass("myclass name-999");
.name-999 {
  width:10px;
  height:10px;
  background:red;
  margin:10px 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="myclass name-212"></div>
<div class="myclass name-545"></div>
<div class="myclass name-767"></div>

Upvotes: 0

Therichpost
Therichpost

Reputation: 1815

try this one also:

$(".myclass").removeClass(function (index, className) {
   return (className.match (/(^|\s)name-\S+/g) || []).join(' ');
});

Upvotes: 2

Riad ZT
Riad ZT

Reputation: 349

You could do this with a regular expression

$('.myclass').removeClass(function (index, cssClass) {

  return (cssClass.match (/\bname-\S+/g) || []).join(' ');

});

It will remove all name- classes from .myclass.

But class names like that are not a good solution, maybe try explaining which problem you used this solution and we could give you a better approach.

Upvotes: 1

Related Questions