Setting <td> with jquery

Question

I have a div structure shown below. For the second <td>in the table, I want to replace the  hyperlink whose href attribute is stored in the myLink variable. How can I do this using jquery?

Please, help. Thank.

<div class="pbHeader">
  <table cellspacing="0" cellpadding="0" border="0">
    <tbody>
         <tr>
             <td class="pbTitle">
               <h2 class="mainTitle">Transfer Membership</h2>
             </td>
             <td>
                    &nbsp;
             </td>
          </tr>
     </tbody>
   </table>
</div>

Answer 1

You can do something like this:

// you said this was already set
var myLink = 'http://stackoverflow.com/questions/2761234';

var $a = $('<a>').attr('href',myLink).text('My Link!');
$('.pbHeader td:eq(1)').empty().append($a);

Here it is used :eq()to capture the second TD under a .pbHeader(:: eq is based on zero, therefore 0 is the first element, 1 is the second element). It empties yours  and adds the generated tag <a>inside it.

You can also do this:

$('.pbHeader td:eq(1)').html('<a href="'+myLink+'">My Text!</a>');

innerHTML <td> ""

jsbin preview