How to get id of clicked div jquery - php

Question

I have been trying to get the id of a clicked div of same classes but with different IDs. I tried everything I know.
Here is one code I tried (in this one, the .click function() does not work .. edit: meaning it does not seem to run the code when clicked at all!):-
$(".u_search").click(function() {
var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + $(".u_search").attr('id');
alert(dataString);
$.ajax({
type: "POST",
url: '/script/profile.php',
data: dataString,
cache: false,
success: function(data) {
$('#ui_profile').show();
$('#ui_profile').html(data);
location.hash = 'profile' + 'id=' + dataString;
$(".searchbox").val('');
$("#usr_suggest").hide();
}
});
});
PHP:-
echo "<tr id='" . $id . "' class='u_search' height='40px'><td width='40px'><img class='avatar' src='$avater' /></td><td>" . $fname_ . " " . $lname_ . "</td></tr>";
}}
Here is another combination of codes I tried (error in this one: suppose I have 5 divs, and even if I clicked the 2nd div or the 3rd div, it only captures the id of the first div [div 1] and not the clicked div. I want to be able to capture the id of the clicked div.):-
$(".u_search").click(function() {
var attr_u_search = $(".u_search").attr('id');
var dataString = '&u_search=' + $(".u_search").attr('id');
alert(dataString);
$.ajax({
type: "POST",
url: '/script/profile.php',
data: dataString,
cache: false,
success: function(data) {
$('#ui_profile').show();
$('#ui_profile').html(data);
location.hash = 'profile' + 'id=' + dataString;
$(".searchbox").val('');
$("#usr_suggest").hide();
}
});
});
PHP:-
echo "<tr id='" . $id . "' class='u_search' height='40px' onclick='javascript:op_prof(1)'><td width='40px'><img class='avatar' src='$avater' /></td><td>" . $fname_ . " " . $lname_ . "</td></tr>";
}}
edit: when I use the first code (the one with .click function()) the code does not seem to run at all! .. I am using jquery library version 1.9.1

Answer 1

Inside your function change
$('.u_search').attr('id')
To
$(this).attr('id')
The quotes are important, but this is not inside quotes ;)

Answer 2

When you do
$(".u_search").click(function() {...
your callback function has now an object called this. You can use it to get the actual object you've clicked. So in this case, if you want to get the ID of the clicked object, simply do this:
var the_id = $(this).attr("id");

Answer 3

Inside a function, you can reference to the active jquery object by using $(this)
$(".u_search").click(function() {
...
//get ID of button being clicked upon
//Jquery Solution
$(this).attr('id');
//Or Javascript
this.id;
...
}

Answer 4

$("div").on("click",function(){
var id = this.id; //returns id
});

Answer 5

var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + $(".u_search").attr('id');
You're selecting every u_search div again to build your datastring, instead of using the already fetched id:
var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + attr_u_search;

Answer 6

i think it's : $(this).attr('id')
You need use $(this) to have the object that clicked..
var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + attr_u_search; // it's better !

Answer 7

Try this :
$('body').on('click', '.u_search', function() {
var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + attr_u_search;
alert(dataString);
// REST OF CODE
});
(Tested and working, if it still does not work, the issue might be somewhere else)

Answer 8

$('body').delegate('.u_search', 'click', function() {
var attr_u_search = $(this).attr('id');
var dataString = '&u_search=' + attr_u_search;
alert(dataString);
});