*UPDATE - This wasn't showing because of a cache issue. The comment referencing changing the jQuery to :first-child instead of :first was indeed the only issue that needed to be addressed. *
I am creating a WordPress theme and the image slider fails to do three things:
1) When clicking an indicator it does not do anything.
2) The image slider does not slide automatically.
3) The first indicator is never on.
I know the content is present because if I add a Post with the Category slider the image will display along with the title and a new carousel indicator. I also checked the DOM and all of the data-slides are there but nothing is moving. Any help is appreciated.
HTML/PHP
<?php
$number = 0;
query_posts('category_name=slider');
if(have_posts()):
?>
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<?php while(have_posts()): the_post(); ?>
<li data-target="#carousel-example-generic" data-slide-to="<?php echo $number++; ?>"></li>
<?php endwhile; ?>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
<?php while(have_posts()): the_post(); ?>
<div class="item">
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id ( $post->ID ), 'single-post-thumbnail' ); ?><a href=#"><img class="img-responsive" src="<?php echo $image[0]; ?>" />
<div class="carousel-caption">
<?php the_title();?>
</div>
</div></a>
<?php endwhile; ?>
</div>
</div>
<?php endif; wp_reset_query(); ?>
jQuery
//Carousel Indicator
$(".carousel-indicators li:first-child").addClass("active");
$(".carousel-inner .item:first-child").addClass("active");