Trigger jquery by clicking on table row

I have a row in a table that I like to make clickable (rather than just the text in the row) so I use the following code to make it open another page:

<td onClick="document.location.href='content2.html';" style="cursor:pointer;">

However now I am using jquery with the below code to open the new page within a div rather than in a new page. How would I update my row code to open the content in the div rather than in a new page.

On the actual text I use the following:

<a class="load_link" style="cursor:pointer;">Link<a> 

However, as I said above I'd like to make the whole row clickable rather than just the text.

JQuery used to update the content:

$(document).ready(func开发者_运维知识库tion(){
     $("#content").load("content.html");
});

(function($) {  
$(function() {  
 $('.load_link').click(function() {  
   $("#content").load("content.html");  
   var $row = $(this).closest("tr");
   $row.removeClass("rownotselected").addClass("rowselected");
   $row.siblings("tr").removeClass("rowselected").addClass("rownotselected");
   return false;   
 });  
});  
})(jQuery); 

Any help would be appreciated!

JQuery can attach functions to click events on table cells, so give the table the rows are in an id, and instead of $('.load_link').click(), use $('.load_link, #tableId td').click().

<style>
.clickable {
  cursor: pointer;
  color:blue;
}
.content {
  border: solid 1px #eee;
  padding: 10px;
}
</style>

<table>
  <tbody>
    <tr class="clickable">
      <td>
        jas
      </td>
    </tr>
  </tbody>
</table>

<div class="content"></div>
<script>
  $(".clickable").on("click", function(){
    $(".content").load("home.html");
  });
</script>

For making individual rows clickable, we can assign class to tr. On clicking tr, update the div.