Jquery how to retrieve / replace value in <span> <tr> <td> value?

Question

There are more than one TR TD, same class name given in a table used for formatting without ID given.

I would like to seek help for jQuery. How can I retrieve / replace <td> content in the span id = payment_currency_text, class="formdata element?

1) To set a variable, store as SGD , getting from second set of TR TD.
2) Replace SGD to EUR .

Note : The system used Jquery version = v1.4.2

I tr to used below syntax but no luck :

alert(jQuery("#payment_currency_text tr.find(.formdata)").val());
alert(jQuery("#payment_currency_text").next('.formdata').val());
alert(jQuery("#payment_currency_text tr td.formdata").val());
alert(jQuery("#payment_currency_text").find(".formdata").html());

... (tr td child)

<tr>

  <td class="prompt" align="left">     
    Region* 
  </td>

  <td class="formdata" align="left">
     Asian 
  </td>
</tr>

<span id ="payment_currency_text"> <!--- There is a SPAN tag, with ID given  --->
<tr>
  <td class="prompt" align="left">     
     Payment currency* 
  </td>

  <td class="formdata" align="left">
     SGD   <!--- How i can set a variable to hold SGD, then replace to EUR?  --->
  </td>
</tr>
</span>

Answer 1

to target td.formdata inside span .Try this:

To get:

 var currency=$('#payment_currency_text .formdata').html();//currency will be SGD here

To set:

 $('#payment_currency_text .formdata').html('EUR');

Answer 2

If you know that its always going to be a specific child you can use the :nth-child() selector.

var setter = $("tr:nth-child(2) td:nth-child(2)").text();

$("tr:nth-child(2) td:nth-child(2)").text("EUR");

alert(setter)

Here is a fiddle http://jsfiddle.net/87V9v/

Answer 3

If you just want to change the html inside the td, use like this

$(".formdata").html("some text or tags here");

If you want to get the text inside those td, use like this

$(".formdata").each(function(){
  $(this).html();
 });

Edit

$("#payment_currency_text").find(".formdata").html()

$("#payment_currency_text").find(".formdata").html("some text or tags here");

Your html structure has some problem, you cant enclose tr inside span. tr should be the child of table . So change your html accordingly.

 <table>
    <tr>

        <td class="prompt" align="left">
            Region*
        </td>

        <td class="formdata" align="left">
            Asian
        </td>
    </tr>


    <tr id="payment_currency_text">
        <td class="prompt" align="left">
            Payment currency*
        </td>

        <td class="formdata" align="left">
            SGD
            <!--- How i can set a variable to hold SGD, then replace to EUR?  --->
        </td>
    </tr>

</table>

Then you can use the above code for getting the elements and values.

Answer 4

In jQuery you can replace the inner HTML of an element like so

$('.class-name').html("Some html in here");

However, be careful because this will replace the HTML for all classes of this name.

Answer 5

You can use text() to get the data (plain text) as well as replace existing data with new one. If your replacement is HTML, you can use html()

var data=$('td.formdata').text();
alert("The value is"+data);
$('td.formdata').text("New Data");

Answer 6

You can use:

$("#payment_currency_text").text("your text");

or

$("#payment_currency_text").html("your<b>text</b>");