Loop through JSON array, display two and then Count

Question

Okay, so I'm a JSON noob with only basic jQuery knowledge and I've looked all over for a solution and can't find one. Any help is greatly appreciated.

I need to:

1) loop through a JSON array (working)

2) display the first two results for "mbrname"

3) then display a count for the rest of the results.

I am successfully looping through and displaying ALL mbrname results. But somehow I need to only display the first two and if there are more display "+ # others"

Here's a screenshot of what the final product should look like:

Here's what my code produces now:

Here's my JSON:

{
 "messages":{
  "message":[
     {
        "date-time":"June 2, 2013 12:22 pm",
        "subject":"This is the message subject",
        "msg-string":"001",
        "newmsg":"true",
        "attach":"shop-cart",
        "recipient":[
           {
              "mbrname":"D. Craig",
              "mbr-href":"#craig"
           },
           {
              "mbrname":"N. McCoy",
              "mbr-href":"#mccoy"
           },
           {
              "mbrname":"J. Smith",
              "mbr-href":"#smith"
           },
           {
              "mbrname":"B. Wardlaw",
              "mbr-href":"#wardlaw"
           }
        ]
     },
     {
        "date-time":"May 23, 2013 12:22 pm",
        "subject":"This is a great subject",
        "attach":"none",
        "msg-string":"002",
        "newmsg":"true",
        "recipient":[
           {
              "mbrname":"D. Craig",
              "mbr-href":"#craig"
           },
           {
              "mbrname":"N. McCoy",
              "mbr-href":"#mccoy"
           }
        ]
     },
     {
        "date-time":"May 11, 2013 12:22 pm",
        "subject":"Interested in your tomatoes",
        "attach":"shop-cart",
        "msg-string":"003",
        "newmsg":"false",
        "recipient":[
           {
              "mbrname":"J. Smith",
              "mbr-href":"#smith"
           }
        ]
     }
  ]
 }
}

Here's my jquery just for the "mbrname" section which successfully pulls in the names and appends them to my HTML:

$.each (message.recipient, function (message, recipient) {
var mbrPart = recipient.mbrname + ', ';
var currentUser = $('#' + newID + ' .name');

$(currentUser).append(mbrPart);

});

Thanks in advance for any help!

Answer 1

I'd keep it simple, no need to do any looping:

var recipientString = message.recipient[0].mbrname;
var count = message.recipient.length;

if (count > 1)
    recipientString += ', ' + message.recipient[1].mbrname;

if (count > 2)
    recipientString += ' + ' + (count - 2) + ' others';

$('#' + newID + ' .name').append(recipientString);

Answer 2

Something like this should work.

var count = 0;
$.each (message.recipient, function (message, recipient) {


if(count<2){
var mbrPart = recipient.mbrname + ', ';
var currentUser = $('#' + newID + ' .name');
$(currentUser).append(mbrPart);
}
count++;
});

$(currentUser).append(" + " + count-2 + " Others");