Suggestions for how to look at first letter, add letter block

[m2244]

Hello,

OK, at this point I have populated a glossary div. When a user clicks on a term this glossary pops-up with all of the terms taken from an XMl file in alphabetical order.

Now what I am trying to do is add the letters 'A', 'B', etc at the beginning of each block of terms beginning with that letter.

Is there an easy way to do this? I was thinking about creating an array with all of the letters of the alphabet, checking the first letter of each term, if it matches, create a new span with that letter, increment the array pointer to look for the next letter.

Is this an efficient way to do it?

This is what I have so far:

		$(glossaryXML).find('item').each(function()
		{
			if($(this).attr('term').substr(0,1) == 'A')
			{
				$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span><br />");
			}
			$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span>" + "<span class='glossDef'>" + $(this).attr('def') + "</span><br />");
			
		});

[m2244]

Well, I already see a problem.

If there isn't a term that begins with the next letter, it breaks. In other words if the code is looking for 'Q', but there aren't any terms that begin with 'Q' the array index does not increment so the code looks for 'Q' and misses all of the letters after 'Q'.

var letterArr2 = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];
		var letteArrIndex = 0;
		$(glossaryXML).find('item').each(function()
		{
			if($(this).attr('term').substr(0,1).toUpperCase() == letterArr2[letteArrIndex])
			{
				$("#glossaryContent").append("<br /><span class='glossAcro'>" + letterArr2[letteArrIndex] + "</span><br />");
				letteArrIndex++;
			}
			$("#glossaryContent").append("<br /><span class='glossAcro'>" + $(this).attr('term') + "</span>" + "<span class='glossDef'>" + $(this).attr('def') + "</span><br />");
			
		});

[Old Pedant]

How about this?

    var letters = "abcdefghijklmnopqrstuvwxyz";
    $(glossaryXML).find('item').each(function()
    {
        var first = ($(this).attr('term').charAt(0).toLowerCase();
        if ( letters.indexOf(first) >= 0 ) /* if that letter is still in the list of letters... */
        {   
            letters = letters.replace(first,"*"); /* kill that letter so can't be found again */
            $("#glossaryContent").append(...);
        }
        $("#glossaryContent").append(...);
    } );

Sneaky?