Ben Kilah
Ben Kilah

Reputation: 3475

Jquery access div in table cell

I'm trying to access the first div with a class from hovering on a table row;

Here is my html:

<table id='search_job_results_table'>
<tbody>
<tr>
<td><div style='position:relative'><div class='search_job_tooltip'>blah blah</div></div></td>
</tr>
</tbody>
</table>

I've tried with the following:

$(function () {
    $('table#search_jobs_result_table tbody tr').mouseover(function () {
        $(this).children().next('div.search_job_tooltip').css('display', 'block');
    });
});

The hovering works part works, as I can wak an alert in there and it triggers, but not setting the css of that div. I always get stuck on this for some reason, any ideas?

Upvotes: 0

Views: 204

Answers (2)

Ram
Ram

Reputation: 144709

you can use find() method and instead of .css('display', 'block'); you can use show() method.

$(function () {
    $('#search_jobs_result_table tr').mouseover(function () {
        $(this).find('.search_job_tooltip:first').show()
    });
});

Upvotes: 0

bugwheels94
bugwheels94

Reputation: 31950

You can't use .next() because div is the children so use this one

$(function () {
    $('table#search_jobs_result_table tbody tr').mouseover(function () {
        $(this).find('div.search_job_tooltip').first().css('display', 'block');
    });
});

Upvotes: 1

Related Questions