how to get a table cell value using jquery?

how to get a table cell value using jquery: Retrieve Data From a Table Cell Using jQuery. How Get Table’s Row And Column Value Using JQuery. Here i am finding table’s rows columns values on clicking.

how to get a table cell value using jquery

How to get the table cell TD values on click using jquery — find() method. Find out how many cells there are in the first row in a table.

Read Table Header And Row Data Using JQuery


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

<html xmlns="">
<title>How to retrieve information from cell clicked in a Table</title>
<script type='text/javascript'
<script type="text/javascript">
$(document).ready(function() {
$("tbody td").click(function(e) {
var activenblData = $(this).text();
var LeftnblData = $(this).prev().text();
var RightnblData = $(this).next().text();
var RowIndex =$(this).parent().parent().children().index($(this).parent());
var memberIndex = $(this).parent().children().index($(this));
var RowsAbove = RowIndex;
var memberName = $(".head").children(':eq(' + memberIndex + ')').text();

.append("<b>Active Cell Text: </b>" + activenblData + "<br/>")
.append("<b>Text to Left of Clicked Cell: </b>" + LeftnblData + "<br/>")
.append("<b>Text to Right of Clicked Cell: </b>" + RightnblData + "<br/>")
.append("<b>Row Index of Clicked Cell: </b>" + RowIndex + "<br/>")
.append("<b>memberumn Index of Clicked Cell: </b>" + memberIndex + "<br/>")
.append("<b>Rows above Active Clicked Row: </b>" + RowsAbove + "<br/>")
.append("<b>memberumn Name of Clicked Cell: </b>" + memberName)

<style type="text/css">
<table id="tableone" border="1">
    <tr class="head">
        <th>Product 1</th>
        <th>Product 2</th>
        <th>Product 3</th>
    <tr >
        <td>Row 0 Product 0</td>
        <td >Row 0 Product 1</td>
        <td >Row 0 Product 2</td>
    <tr >
        <td>Row 1 Product 0</td>
        <td>Row 1 Product 1</td>
        <td>Row 1 Product 2</td>
    <tr >
        <td>Row 2 Product 0</td>
        <td>Row 2 Product 1</td>
        <td>Row 2 Product 2</td>
    <tr >
        <td>Row 3 Product 0</td>
        <td>Row 3 Product 1</td>
        <td>Row 3 Product 2</td>
     <tr >
        <td>Row 4 Product 0</td>
        <td>Row 4 Product 1</td>
        <td>Row 4 Product 2</td>
     <tr >
        <td>Row 5 Product 0</td>
        <td>Row 5 Product 1</td>
        <td>Row 5 Product 2</td>
<p id="para" />


Read all the data of the table.

<script type="text/javascript">  
        $(document).ready(function () {  
            $('#html_to_genrate_img').click(function () {  
                var result_member_dt = "";  
                var flagTbl = true;  
                $('#tblArticles tbody>tr').each(function () {  
                    $('td', this).each(function () {  
                        if (result_member_dt.length == 0 || flagTbl == true) {  
                            result_member_dt += $(this).text();  
                            flagTbl = false;  
                            result_member_dt += " | " + $(this).text();  
                    result_member_dt += "\n";  
                    flagTbl = true;  

<input id="html_to_genrate_img" type="button" value="Read HTML Table Using JQuery/Javascript" />   


<script type="text/javascript" src=""></script>
<table id="tblArticles" border="1px" cellpadding="2" cellspacing="2">  
<caption style="text-align:left;font-weight:bold;">Blog List:</caption>  
 <thead style="background-color:Lime;">  
     <th>Blog Code</th>  
     <th>Blog Title</th>  
     <th>Blog Published Date</th>  
     <th>No. of Views</th>  
     <td>read.csv r documentation and read.delim in r, read table abap</td>  
     <td>Jan, 2022</td>  
     <td>Feb, 2022</td>  
     <td>reading and getting data into r</td>  
     <td>Mar, 2022</td>  
     <td>how to read data from datatable in c# using linq</td>  
     <td>Apr, 2022</td>  

Don’t Miss : How To Get Selected Row Value In Html Table

I hope you get an idea about how to get a table cell value using jquery.
I would like to have feedback on my
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.