The selector did not word for all DOM elements

Question

I have a problem. I have two elements in html with the same id. And the problem is that my code works only for the first one. How to resolve this problem?

 <div class="pagi">
  <a href="/" class="paginationPrev" id="paginationPrev">{l s='Następna strona' mod='psoft_allegro'}</a>
  <select id="pagination">
  {for $pagenum = 1 to $countPage} 
    <option value="{$pagenum}" {if $selectedPage == $pagenum}selected{/if}>{$pagenum}</option>
  {/for}
  </select>
  <a href="/" class="paginationNext" id="paginationNext">{l s='Następna strona' mod='psoft_allegro'}</a>
</div>

And my jquery:

$(document).ready(function() {

    var str1 = window.location.href.replace(/^&page=\d/g, '');
    var val = $('#pagination').val();

    //Next page
    var next = parseInt(val) + 1;
    $("#paginationNext").attr("href", str1 + '&page=' + next);

    //Prev page
    if (val > 1) {
        var prev = parseInt(val) - 1;
        $("#paginationPrev").attr("href", str1 + '&page=' + prev);
    } else {
        $("#paginationPrev").attr("href", str1);
    }


});

I have two elements of paginationNext and paginationPrev. Above you see only one.