Get value of text inside span

I am working with Flexigrid plugin with JQuery. Ok so I have a div with two span elements, they would contain the text/display text for the buttons that flexigrid provides. The problem is, there is no mechanism to add ids to those buttons, except for adding different text.

<div class="tdiv2>  
    <div class="fbutton">
        <div>
            <span class="view" style="padding-left: 20px;">Add</span>
        </div>
    </div>
    <div class="fbutton">
        <div>
            <span class="view" style="padding-left: 20px;">Delete</span>
        </div>
    </div>
</div>  

This is h开发者_如何学Goow the buttons are arranged. So onclick of that button, I get the text inside the span, as Add and Delete. Now I want to add a class tag to that span, to differentiate between the active button and the other one.

So I came up with the idea, that if I could get span-text that matches to the text being returned, I could add the class to that span.

But when I do

alert($('.tDiv2 span').html()); 

I am only getting the text of the first span and not the second one. Could somebody help me with getting the html of both spans and not just the first one.

Try this >

$('.tDiv2 span').each(function(index, el) { alert($(el).html()); });

You need each.

$('.tDiv2 span')each(function(node){ alert(node.html()); });

However, I would like to point out that this approach is likely to cause accessibility problems for screen reader users. If you absolutely must re-invent buttons for some reason, then use ARIA attributes so that your blind visitors have some hope of getting it to work right.

jQuery automatically selects the first element in a series if you try to get a property like html or text from it. to get the second (or any number) try:

alert($('.tDiv2 span').eq(1).html()); //returns 2nd element's html content

You can substitute any 0 based index in for 1.