CODEWITHSUNDEEP
javascriptjqueryhtml
Chris Levine
Chris Levine

Reputation: 273

how to use jquery to get value out of div

How do I get the contents of a div using Jquery.

Here is my HTML:

<div class="DataRow" data-vendorid="67">
    <div class="DataColumn" style="width: 60%;">
        Barracuda
    </div>
    <div class="DataColumn" style="width: 20%; text-align: center;">
        1
    </div>
    <div class="DataColumn" style="width: 20%; text-align: center;">
        2
    </div>
</div>

Here is my Jquery:

$(function () {
    $('.DataRow').click(function () {
        // get value: Barracuda 
    });
});

Upvotes: 2

Views: 1052

Answers (5)

Eugene Trofimenko
Eugene Trofimenko

Reputation: 1631

If you need to get content of the clicked div it might help you.

$(function () {
    $('.DataRow').click(function (event) {

        alert(event.target.innerHTML);
    });
});​

DEMO 1

If you need to get only the first value:

$('.DataRow').click(function () {
    var first = $(this).children().eq(0).html();
    alert(first);
});​

DEMO 2

Upvotes: 3

Dovydas Navickas
Dovydas Navickas

Reputation: 3591

If you need to get only "Baracuda", i.e. first div text, you could use innerHTML like this:

$(function () {
    $('.DataRow').click(function () {
        // get value: Barracuda 
        alert($(this).children("div")[0].innerHTML);
    });
});​

Here is an example.

Upvotes: 1

VisioN
VisioN

Reputation: 145458

To get the contents of the first child:

$('.DataRow').click(function () {
    var first = $(this).children(":first").html();
});

To get the contents of the third child:

$('.DataRow').click(function () {
    var third = $(this).children(":eq(2)").html();
});

Upvotes: 0

karan k
karan k

Reputation: 977

You could also use this:

var value=$(".DataColumn").html();

Upvotes: 0

Alex
Alex

Reputation: 35407

$(function () {
    $('.DataRow').click(function () {
        alert($(this).find(':first-child').text());
    });
});

Or:

$(function () {
    $('.DataRow').click(function () {
        alert($(this).children().first().text());
    });
});

Upvotes: 4

Related Questions