Select multiple classes jquery
<p>I'm pretty new to Jquery and writing a gallery with multiple pages and I have a problem with the Jquery selector.</p>

<p>I'm trying to select a <code>img</code> tag and a <code>a</code> tag, both tags have different class names and are in a <code>.portfolio-item</code> class. </p>

<p>What I've tried is </p>

<pre><code>var countImages = $(".portfolio-item a img").length;
    console.log(countImages);
    var perPage = 8;
    $('.image, .edit-post-link').css('display', 'none');
    //$('.post-edit-link').css('display', 'none');
    //$('.slider').children().slice(0, perPage).css('display', 'block');
    $('.image, .edit-post-link').slice(0, perPage).fadeIn("fast");
    //$('.post-edit-link').slice(0, perPage).fadeIn("fast");
    function goTo(pageNumb){
        var startFrom = pageNumb * perPage;
        var endOn = startFrom + perPage;
        //$('.post-edit-link').fadeOut("fast").delay( 200 ).slice(startFrom, endOn).fadeIn("fast");
        $('.image, .edit-post-link').fadeOut("fast").delay( 200 ).slice(startFrom, endOn).fadeIn("fast");
    }
    var buttons = countImages/perPage;
    console.log(buttons);
    for (var i = 0; i &lt; buttons; i++) {
        var number = i + 1;
        $(".pagination").append("&lt;li&gt;&lt;a class='navigation-number'&gt;"+number+"&lt;/a&gt;&lt;/li&gt;");
        //console.log(number);
    };
    $('.navigation-number').on('click', function() {
        var pageNumber  = $(this).text(); 
        goTo(pageNumber -1);
    });
</code></pre>

<p>this only results in 4 images on each page, but I wanted 8 on one page</p>

<pre><code>    &lt;?php if (have_posts()): while (have_posts()) : the_post(); ?&gt;


    &lt;div class="portfolio-item"&gt;
        &lt;!-- post thumbnail --&gt;
        &lt;?php if ( has_post_thumbnail()) : // Check if thumbnail exists ?&gt;
            &lt;a href="&lt;?php the_permalink(); ?&gt;" title="&lt;?php the_title(); ?&gt;"&gt;
                &lt;?php the_post_thumbnail('medium', array('class' =&gt; 'img-responsive image')); // Declare pixel size you need inside the array ?&gt;
            &lt;/a&gt;
        &lt;?php endif; ?&gt;
        &lt;!-- /post thumbnail --&gt;
        &lt;div class="edit-post-link"&gt;
            &lt;?php edit_post_link(); ?&gt;  
        &lt;/div&gt;
    &lt;/div&gt;
</code></pre>



<p>Edit 3:</p>

<pre><code>&lt;div class="col-md-3 portfolio-item"&gt;
    &lt;!-- post thumbnail --&gt;
                &lt;a href="http://www.q-mediaspot.nl/blog/cinema-4d/cinema-4d-vaas/" title="Cinema 4d Vaas" style="display: none;"&gt;
            &lt;img src="http://www.q-mediaspot.nl/blog/wp-content/uploads/2016/03/placeholder1-250x150.jpg" class="img-responsive image wp-post-image" alt="placeholder1"&gt;            &lt;/a&gt;
            &lt;!-- /post thumbnail --&gt;

    &lt;div class="edit-post-link"&gt;
        &lt;a class="post-edit-link" href="http://www.mywebsite.nl/blog/wp-admin/post.php?post=4&amp;amp;action=edit"&gt;Edit This&lt;/a&gt;    
    &lt;/div&gt;      
</code></pre>

<p></p>