CODEWITHSUNDEEP
javascriptjqueryruby-on-rails-4
computer_smile
computer_smile

Reputation: 2247

Rails 4 jQuery selector not working

I don't understand why this is not working; it's seemingly very simple. Class of active is not being added to the first child of the jQuery selected div with class of carousel-inner. 

<div id="public-feed-carousel" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
        <div class="item">
            <img src="http://placehold.it/600x200">
        </div>
        <div class="item">
            <img src="http://placehold.it/600x200">
        </div>
        <div class="item">
            <img src="http://placehold.it/600x200">
        </div>
    </div>
</div>

<script>
  $(function() {
    $('div.carousel-inner:first-child').addClass("active");
  });
</script>

This is in the show view of a rails app.

Upvotes: 0

Views: 208

Answers (2)

Alex
Alex

Reputation: 66012

With div.carousel-inner:first-child, you're saying "Give me all divs with a class of carousel-inner that are first child's of their parent."

It sounds like you mean, "Give me the first child element of all divs with a class of carousel-inner" which actually looks like this:

div.carousel-inner :first-child

Upvotes: 3

murphyslaw
murphyslaw

Reputation: 636

Is it possible, that another JavaScript transforms the DOM before your function is executed? Try to use console.debug on $('div.carousel-inner:first-child') to see, if it exists and where it might be located. Another thing is, that you might want to put your JavaScript in a document.ready section, so it is executed after the DOM finished loading.

Upvotes: 0

Related Questions