CODEWITHSUNDEEP
javascriptjquery
Subhajit Panja
Subhajit Panja

Reputation: 1240

jquery :nth-child() class is not working

This is not working 

$(".text_read:nth-child(2)").css("background", "transparent url('images/text_read2.png') no-repeat");

above code's result is same as below code

$(".text_read").css("background", "transparent url('images/text_read2.png') no-repeat");

And my HTML code is

<div class="welcome">
                    <p class="welcometext">MORE UPCOMING NEWS FOR INTERNATIONAL EVENTS</p>
                    <div class="all_international_img row-fluid">
                    <div class="welcome-image span4 international_img">
                        <img src="images/img1.png">
                        <div class="text_read">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a </div>
                    </div><!--all_international_img row-fluid-->
                    <div class="welcome-image span4 international_img">
                        <img src="images/img1.png">
                        <div class="text_read">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a </div>
                    </div><!--all_international_img row-fluid-->
                    <div class="welcome-image span4 international_img">
                        <img src="images/img1.png">
                        <div class="text_read">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a </div>
                    </div><!--all_international_img row-fluid-->
                    </div><!--all_international_img-->
                </div><!--welcome-->

Upvotes: 2

Views: 222

Answers (4)

sudhansu63
sudhansu63

Reputation: 6180

You can try this.

$(".text_read").eq(2).css({"background", "transparent url('images/text_read2.png') no-repeat"});

Upvotes: 1

Tushar Gupta - curioustushar
Tushar Gupta - curioustushar

Reputation: 57105

Use instead :nth in .eq()

DEMO

$('.text_read:nth(2)');

Upvotes: 2

S. S. Rawat
S. S. Rawat

Reputation: 6111

You can use Eq to get the child element

$('.text_read).eq(0);

Upvotes: 1

Anton
Anton

Reputation: 32581

Looks like you want to use .eq() instead

$('.text_read:eq(2)')

DEMO

Upvotes: 3

Related Questions