The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

jQuery Array

  • # October 25, 2012 at 10:31 pm

    I’m having troubles traversing an array in jQuery. I want to make navigation (next & prev) for pages based on an li that I have on the page. I’d like to grab the hrefs from the list on the page, compare them with the url of the current page, then make a link to the previous and next pages from the list.

    Here is what I’ve done so far, and am stuck…



    $('a').each(function(index, value) {
    var currentPage = "";
    if (value == currentPage){$('.nav').append(index + ': ' + value);}

    I just can’t figure out how to get the hrefs from track 2 and track 4 and append links to the nav. Any help would be greatly appreciated!

    Thank you!

    # October 25, 2012 at 10:33 pm

    My code wasn’t showing in the original post. This is the HTML I’m working with.

    # October 26, 2012 at 7:03 am
    // Get the current page url:
    var currentUrl = window.location.href;
    var currLink = $('#tracks').find('a[href="' + currentUrl + '"]');
    // Get the index:
    var index = curLink.parent().index() + 1; // (+1) means 'next'
    // Get the next `li > a` href:
    var nextPage = currLink.parent().next().find('a').attr('href');
    // Show the index & the href value:
    $('.nav').append(index + ': ' + nextPage);
    # October 26, 2012 at 9:56 am


    Thanks for the help! I understand what you’ve done. I will go try it out now.



Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed