Home/ Questions/Q 6574693
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T15:17:34+00:00

I am trying to select a span within a span within a div using

  • 0

I am trying to select a span within a span within a div using plain CSS or JQuery selectors. The html is as follows:

<div id="example2_paginate" class="dataTables_paginate paging_full_numbers">
<span id="example2_first" class="first paginate_button paginate_button_disabled">First</span>
<span id="example2_previous" class="previous paginate_button paginate_button_disabled">Previous</span>
<span>
<span class="paginate_active">1</span>
<span class="paginate_button">2</span>
<span class="paginate_button">3</span>
<span class="paginate_button">4</span>
<span class="paginate_button">5</span>
</span>
<span id="example2_next" class="next paginate_button">Next</span>
<span id="example2_last" class="last paginate_button">Last</span>
</div>

I want to select spans that contain 1 to 5 (paginate_active and the 5 paginate buttons), individually.

With my very limited knowledge of CSS and jQuery I’ve tried a couple of things but I’m sure my syntax is wrong, like $("paging_full_numbers span:eq(1)") .

Could you please give me a hint of how to go about it?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    To select them individually, you can simply select them all and then use jQuerys .each(). For example

    spanList = $('#example2_paginate').find('.paginate_active, .paginate_button');

    will find all classes of ‘paginate_active’ or ‘paginate_button’ that, are inside your element of id=example2_paginate. Then you can write:

     spanList.each(function(index){
    <-- code here for occurence of index index-->
});

    Alternatively to select the i^th button without looping through them all:

    spanList.eq(i)

    See jsFiddle: http://jsfiddle.net/t4KWr/

    • 0