Loop Through Groups Of Spans In Jquery

4Get End-Of-Day Reuters Feed Rates

Solution 1:

$("span.runId").each(function(){
    var runId = $(this).text(),
        processname = $(this).next("span.processName").text();
});

Solution 2:

Functional programming to the rescue:

vardata = $td.children('span.runId').map(function() {
   return {runId: $(this).text(), processName: $(this).next().text()};
}).get();

Structure the data how ever you want to.

Solution 3:

To be honest, I would suggest that if they have that type of correlation that they are wrapped together in another tag, or better yet combined as they are not even displayed. This, of course, does not apply to parsing code you do not have write/modify access to.

Suggested html:

<table><tr><tdstyle="display:none;"><spandata-runid='4'class="processName">Get End-Of-Day Reuters Feed Rates</span><spandata-runid='130'class="processName">Get End-Of-Day Bloomberg Feed Rates</span><spandata-runid='133'class="processName">CapVolsCalibration AllCurrencies EOD</span><spandata-runid='228'class="processName">GBP Basis Adjustment</span></td></tr></table>

jQuery:

$("td span.processName").each(function() {
    var runid, processName, $this = $(this);
    runid = $this.data('runid');
    processName = $this.text();
});

I'm not exactly sure what your needs are, but I'd even get rid of the class processName as well. Since the data isn't displayed, it's not really needed at this level assuming you don't need to access this for other purposes. This minimizes down to:

html:

<tableid='someId'><tr><tdstyle="display:none;"><spandata-runid='4'>Get End-Of-Day Reuters Feed Rates</span><spandata-runid='130'>Get End-Of-Day Bloomberg Feed Rates</span><spandata-runid='133'>CapVolsCalibration AllCurrencies EOD</span><spandata-runid='228'>GBP Basis Adjustment</span></td></tr></table>

jQuery:

$("#someId").find('td span').each(function() {
    var runid, processName, $this = $(this);
    runId = $this.data('runid');
    processName = $this.text();
});

Technically, you can't have a span outside of a td in a table, so it could be reduced further:

$("#someId").find('span').each(function() {
    var runid, processName, $this = $(this);
    runId = $this.data('runid');
    processName = $this.text();
});

Solution 4:

So many ways to do things with jQuery:

$('td > span:nth-child(2n-1)').text(function(i,txt) { 
    alert(txt + $(this).next().text());
});

Example:http://jsfiddle.net/vqs38/