CODEWITHSUNDEEP
jqueryhtmlcss
Evolutio
Evolutio

Reputation: 974

How to find the prev. class with jQuery

I have no Idea how I can find the prev. class "cmd and path" with jQuery.

Here is my html code:

<tr>
    <td>MySQL</td>
    <td class="path">/etc/init.d/mysql</td>
    <td class="cmd">status</td>
    <td><i class="icon-remove"></i> <i class="icon-pencil"></i></td>
</tr>

and my jQuery code looks:

$('i.icon-pencil').click(function() {
    var text = $(this).prev('.cmd').text();
    alert(text);
});

Upvotes: 2

Views: 169

Answers (6)

3Dom
3Dom

Reputation: 805

prev() is not working because it's not traversing up the DOM tree, which you need to do for this to work. You need to go up 2 levels, to the tr, and then search the children for the "td" tag with class "cmd". Your code should work like so...

$('i.icon-pencil').click(function() {
var text = $(this).parent().parent().children('.cmd').text();
alert(text);
});

Hope that helped.

Upvotes: 0

rahul maindargi
rahul maindargi

Reputation: 5655

THe problem in you code is '.cmd' not prev to your $(this) its prev to parent.

$('i.icon-pencil').click(function() {
    var text = $(this).parent().prev('.cmd').text();
    alert(text);
});

Upvotes: 1

Eli
Eli

Reputation: 14827

You can use:

$('i.icon-pencil').click(function() {
    var parent = $(this).parent(),
        txtCmd = parent.prev('.cmd').text(),
        txtPath = parent.prev('.path').text();
});

Upvotes: 1

A. Wolff
A. Wolff

Reputation: 74420

$('i.icon-pencil').click(function() {
    var tr = $(this).closest('tr'),
        txtPath = tr.find('.path').text(),
        txtCmd = tr.find('.cmd').text();

});

Upvotes: 2

Andreas Louv
Andreas Louv

Reputation: 47119

$('i.icon-pencil').click(function() {
    var text = $(this).closest('tr').children('.cmd').text(); // .path can also be the selector.
    alert(text);
});

Another way is using .prevAll():

$('i.icon-pencil').click(function() {
    var text = $(this).parent().prevAll('.cmd').text(); // .path can also be the selector.
    alert(text);
});

Upvotes: 0

Anjith K P
Anjith K P

Reputation: 2158

$('i.icon-pencil').click(function() {
    var text = $(this).closest('td').prev('.cmd').text();
    alert(text);
});

Fiddle

Upvotes: 2

Related Questions