joq3
joq3

Reputation: 145

Selecting all firsts with specific class with jQuery?

I am using the code below to create a scrolling text. The problem is that I have multiple divs which contains .vscontent and I want to select the first of every .vscontent in the different "div-trees". Right now only the first .vscontent of the first div is selected. How do I make this change happen to all of them at the same time?

Is there a .vs-content:first which selects all the firsts?

$(function() {
    var $this = $("#vs");
    var scrollTimer;
    $this.hover(function() {
        clearInterval(scrollTimer);
    }, function() {
        scrollTimer = setInterval(function() {
            scrollNews($this);
        }, 1500);
    }).trigger("mouseleave");

    function scrollNews(obj) {
        var $self = obj.find("#vs-container");
        var lineHeight = $self.find(".vs-content:first").height();
        $self.animate({
            "marginTop": -lineHeight + "px"
        }, 300, function() {
            $self.css({
                marginTop: 0
            }).find(".vs-content:first").appendTo($self);
        })
    }
})

Upvotes: 0

Views: 60

Answers (2)

Alen.Toma
Alen.Toma

Reputation: 4870

This should clarify how jq child selection work.

$("div p:first-child").addClass("active")
.active{

color:red;

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>

<p>1</p>
<p>1</p>
<p>1</p>
</div>

<div>

<p>1</p>
<p>1</p>
<p>1</p>
</div>


<div>

<p>1</p>
<p>1</p>
<p>1</p>
</div>


<div>

<p>1</p>
<p>1</p>
<p>1</p>
</div>

Upvotes: 0

ZERROUKI Ali
ZERROUKI Ali

Reputation: 249

salam, this work fine with me

 (".vs-content>:first-child")

Upvotes: 1

Related Questions