Question

is it possible to change the innerhtml of all the td when it has the input inside, i mean to take the input’s value and apply it to it’s td innerhtml, for example, here’s the table and its input inside:

<table>
 <tr>
  <td><input value="test" /></td>
  <td>123</td>
 </tr>
</table>

to change it smth into this:

<table>
 <tr>
  <td>test</td>
  <td>123</td>
 </tr>
</table>

for all of the td and input values without applying id’s and classes?! please pay attention that td innerhtml didnt change 🙂 thank you all for the help! 😉

Answer 1

That’s pretty easy.

Name your table first (to find it easily).

<table id="the_table">
 <tr>
  <td><input value="test" /></td>
 </tr>
</table>

Then you can do this:

$('#the_table td input[type="text"]').each(function() {
  var val = $(this).val();
  $(this).parent('td').html(val);
});

Live demo.

Explanation:

1. find all inputs that are within <td> that are in this certain table.

2. for each input:

   2.1 retrieve value from the input

   2.2 find first parent of the input that is a <td> tag and set its innerHTML to that value