Question

When i do console log following is the html structure, that is printed:

<div class="ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" data-id="21">
          <div class="ui-widget-header ui-corner-all">
             <span class="ui-icon ui-icon-minusthick"></span>
             <h6>First Person</h6>
          </div>
          <p class="style-content"></p>
          <p class="style-content">Estimated Missing: 10</p>
          <p class="style-content">
            <span class="sub_task">6</span> 
            People Found
          </p>
        </div>

I want to add additional class delta to <span class="sub_task">6</span> if a given variable alpha = "12"

As of now my js file looks like this:

console.log(elem)
elem = $(this).children()[3];
if (alpha=="12"){
elem.addClass("delta");
}

but this gives an error:

Uncaught TypeError: Object #<HTMLParagraphElement> has no method 'addClass' 

I have two questions:

a better selector to get the element.

how can i add the class?

Answer 1

Use $ or jQuery since addClass is a function of jQuery:

$(elem).addClass("delta");

Or

jQuery(elem).addClass("delta");

Also change:

elem = $(this).children()[3];

To:

elem = $(this).children().eq(2).find('span'); // note index starts at 0 in eq

Or you can add class directly like this (assuming you have same html structure)

if (alpha == "12") {
   $('.style-content').find('span').addClass("delta");
}