Pagination problem with Isotope filtering

Hi everybody!

I’m trying to filtering my blog posts by category with Isotope filtering, but unfortunately the pagination not working with it anymore 🙁 actually it changes the page – i can see it in the url – but the content doesn’t change with it, it remains the same like the first page. Do you know how to fix this? Thank you in advance!

Here’s my code:

<!-- Filterable Posts -->
<div id="filterable-posts" class="ac">

	<h1>Latest News</h1>

	<div class="container">
		<div class="row">

			<!-- Filters -->
			<ul id="filters" class="ma pc">
			    <li><a href="#" data-filter="*" class="active">All</a></li>
				<?php
					$terms = get_terms("category"); // get all categories, but possibel to use taxonomy
					$count = count($terms); //How many are they?
					if ( $count > 0 ){  //If there are more than 0 terms
						foreach ( $terms as $term ) {  //for each term:
							echo "<li><a href='#' data-filter='.".$term->slug."'>" . $term->name . "</a></li>\n";
							//Create a list item with the current term slug for sorting, and name for label
						}
					}
				?>
			</ul>
			<!-- End Filters -->

			<?php $wp_query = new WP_Query( 'max_num_pages=10' ); //Check the WP_Query docs to see how you can limit which posts to display ?>
			<?php if ( $wp_query->have_posts() ) : ?>

			    <!-- Isotope Container -->
			    <ul class="isotope">
			    <?php while ( $wp_query->have_posts() ) : $wp_query->the_post();
				$termsArray = get_the_terms( $post->ID, "category" );  //Get the terms for this particular item
				$termsString = ""; //initialize the string that will contain the terms
					foreach ( $termsArray as $term ) { // for each term
						$termsString .= $term->slug.' '; //create a string that has all the slugs
					}
				?> 

					<li class="<?php echo $termsString; ?> element-item">
						<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

							<!-- Meta -->
							<span class="category"><?php exclude_category(' / ') ?></span>
							<span class="date"><?php the_time('d. m. y'); ?></span>
							<!-- End Meta -->

							<!-- Post Title -->
							<h3>
								<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
							</h3>
							<!-- End Post Title -->

							<!-- Post Excerpt -->
							<p> <?php theme_excerpt('short_excerpt'); ?> </p>
							<!-- End Post Excerpt -->

							<!-- Button -->
							<button class="ma"><a href="<?php the_permalink(); ?>">view more</a></button>
							<!-- End Button -->

						</article>
					</li>

				<?php endwhile; ?>

				<?php else: ?>
					<p class="ac">There are no posts here, please add some to "Featured" category.</p>
				<?php endif; ?>

			    </ul>
			    <!-- End Isotope Container -->

			<div class="pagination">
				<?php numeric_pagination(); ?>
			</div>

		</div>
	</div>

</div>
<!-- End Filterable Posts -->

Code for pagination:

<?php function numeric_pagination() {

	if( is_singular() )
		return;

	global $wp_query;

	/** Stop execution if there's only 1 page */
	if( $wp_query->max_num_pages <= 1 )
		return;

	$paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
	$max   = intval( $wp_query->max_num_pages );

	/**	Add current page to the array */
	if ( $paged >= 1 )
		$links[] = $paged;

	/**	Add the pages around the current page to the array */
	if ( $paged >= 3 ) {
		$links[] = $paged - 1;
		$links[] = $paged - 2;
	}

	if ( ( $paged + 2 ) <= $max ) {
		$links[] = $paged + 2;
		$links[] = $paged + 1;
	}

	echo '<div class="navigation"><ul>' . "\n";

	/**	Previous Post Link */
	if ( get_previous_posts_link() )
		printf( '<li class="prev">%s</li>' . "\n", get_previous_posts_link('') );

	/**	Link to first page, plus ellipses if necessary */
	if ( ! in_array( 1, $links ) ) {
		$class = 1 == $paged ? ' class="active"' : '';

		printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( 1 ) ), '1' );

		if ( ! in_array( 2, $links ) )
			echo '<li>…</li>';
	}

	/**	Link to current page, plus 2 pages in either direction if necessary */
	sort( $links );
	foreach ( (array) $links as $link ) {
		$class = $paged == $link ? ' class="active"' : '';
		printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $link ) ), $link );
	}

	/**	Link to last page, plus ellipses if necessary */
	if ( ! in_array( $max, $links ) ) {
		if ( ! in_array( $max - 1, $links ) )
			echo '<li>…</li>' . "\n";

		$class = $paged == $max ? ' class="active"' : '';
		printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $max ) ), $max );
	}

	/**	Next Post Link */
	if ( get_next_posts_link() )
		printf( '<li class="next">%s</li>' . "\n", get_next_posts_link('') );

	echo '</ul></div>' . "\n";

} ?>

JS for Isotope:

var $container = $('.isotope').isotope({
	    itemSelector: '.element-item',
	    layoutMode: 'fitRows',
	});

	$('#filters a').click(function(){
		$('#filters a.active').removeClass('active');

		var selector = $(this).attr('data-filter');
		$container.isotope({ filter: selector});

		$(this).addClass('active');
		return false;
	});