Question

I have this html code:

<div class="rotation">
  <ul>
    <li><img src="..." alt="" /></li>
    <li><img src="..." alt="" /></li>
    <li><img src="..." alt="" /></li>
  </ul>
</div>

I need to add class to ul, i want to do it using jquery, because ul, li are generated without any class.
Let say ul tag need to be <ul class="image_rotation">. How can i do it?

Answer 1

Read about jQuery’s addClass method here.

$('.rotation ul').addClass('image_rotation');

The above code will add a class of image_rotation to every ul that is a descendant of any element with the class rotation.

If you want to target only uls that are an immediate child of an element with a class of rotation, use the child selector (>):

$('.rotation > ul').addClass('image_rotation');

If you only want to do this on one .rotation element, you should give it an id and select it that way. For example:

$('#rotation ul');

and

<div id="rotation" class="rotation">
    <ul>
        <li><img src="..." alt="" /></li>
        <li><img src="..." alt="" /></li>
        <li><img src="..." alt="" /></li>
    </ul>
</div>