Question

I am starting to learn jQuery programming and would like to ask for assistance in writing this snippet of code.

There is a ul list of several li items. Each li has the following structure

 <li><a href="http://www.findadeal.com/city-state/"/>City</li> 

where city-state and City are hard coded values of any city, say

 <li><a href="http://www.findadeal.com/buffalo-ny/"/>Buffalo</li>

When the page is requested a product classification parameter, say “beer”, is sent in a query string.

I need to modify the li links to the obtain following form during the page load.

 <li><a href="http://www.findadeal.com/buffalo-ny/beer/"/>Buffalo Beer</li>

How would I code the looping logic with jQuery so that each li elemnt is modified accordingly. There are usually no more than 50 cities on a page.

Thank you.

Answer 1

I’m not entirely sure what you’re looking for, but I think this might get you on your way.

$('li').each(function(){ //grab all li elements and loop through them
   var $this = $(this); //capture the jquery object for use later
   $this.find('a').attr('href','your new text');
});