CODEWITHSUNDEEP
javascriptjqueryhtmlcss
john stoe
john stoe

Reputation: 39

jquery - add class to existing div with multiple classes

I'm trying to add a class to an existing div that has multiple classes but doesn't work, the class is not added. I've added this on header (it's s shopify template):

<script type="text/javascript">
 jQuery(document).ready(function($) {
$('div.wk_right_header_inner wk_font_weight_bold wk_font_family wk_paddingbottom10').addClass('new-class');
 });
 </script>

The div looks like this (with no space after <):

<div class="wk_right_header_inner wk_font_weight_bold wk_font_family  
 wk_paddingbottom10"> Test </div>

Thanks

Upvotes: 0

Views: 2133

Answers (2)

divy3993
divy3993

Reputation: 5810

Have a look a this:

 jQuery(document).ready(function($) {
$(' .wk_right_header_inner ').addClass('new-class');
 });
.new-class
{
  color:red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="wk_right_header_inner wk_font_weight_bold wk_font_family wk_paddingbottom10"> Test </div>

Upvotes: 1

Niki van Stein
Niki van Stein

Reputation: 10744

You need to do 

$('div.wk_right_header_inner.wk_font_weight_bold.wk_font_family.wk_paddingbottom10').addClass('new-class');
 });

Because now it thinks the other classes are sub elements.

Upvotes: 2

Related Questions