Access Datalist label with JQuery or Javascript

Question

I have a datalist generated from the back end. From the client side I need to access a label in the datalist with Jquery or Javascript. Here is the client side that's generated:

<table id="wmsBody_dlstItems" cellspacing="0" style="border-collapse:collapse;">
<tr>
    <td>
        <table border="0" cellpadding="2" style="text-align:center">
            <tr>
                <td>
                <span id="wmsBody_dlstItems_lblItemBoxID_0" class="txtPick3">4883658</span><br />
                    <span id="wmsBody_dlstItems_lblfull_item_number_0" class="txtPick2">37UPC341890NC</span><br />
                </td>
            </tr>
        </table>
    </td><td>
        <table border="0" cellpadding="2" style="text-align:center">
            <tr>
                <td>
                <span id="wmsBody_dlstItems_lblItemBoxID_1" class="txtPick3">5043328</span><br />
                    <span id="wmsBody_dlstItems_lblfull_item_number_1" class="txtPick2">37WVNL70blk</span><br />
                </td>
            </tr>
        </table>
    </td><td>
</tr>

How can I access via JavaScript or JQuery the value stored in the label lblItemBoxID. There are 2 values here, 4883658 and 5043328. Thanks for your help ... Bob

Answer 1

Your best option, given your generated HTML, is to select by class :

$('.txtPick3')

if you want to iterate through the elements and get the values, you should do something like this:

$('.txtPick3').each(function(index, elem){
    var myValue = $(elem).text();
    //now do something with the found value
})

Alternatively to selection by class , you can also, given your HTML, select by your element ID pattern, using the "Attribute Starts With" selector :

$('span[id^="wmsBody_dlstItems_lblItemBoxID_"]')

Answer 2

The simplest of all Would be is to use the class .txtPick3

Or you can write up jQuery code to get this ..

Check this FIDDLE

​var labels = $('table table')​.find('span:eq(0)') ;

$.each(labels, function(i){
   alert($(labels[i]).text()); 
});

Check the UPDATED FIDDLE here