I want to add like functionality to my site using jQuery but my element selectors aren't working.
HTML:
<a class="btn-like" id="1">2</a>
JQUERY(HTML NOT WORKING):
$( document ).ready(function() {
$(".btn-like").click(function() {
var like_id = $(this).attr("id");
$('a.btn-like#'+like_id).html('Loading ...');
$.ajax({
type: "POST",
url: "like.php",
data: 'item_id='+like_id,
cache: false,
success: function(data) {
$('a.btn-like#'+like_id).html(data);
alert(data); //correct response
$('a.btn-like#'+like_id).addClass('liked');
}
});
return false;
});
});
JQUERY(HTML WORKING):
$( document ).ready(function() {
$(".btn-delete").click(function() {
var item_id = $(this).attr("id");
$('a.btn-delete#'+item_id).html('Loading ...');
$.ajax({
type: "POST",
url: "post.php",
data: 'item_id='+item_id,
cache: false,
success: function(data) {
$('div#post_'+item_id).remove();
}
});
return false;
});
});
The response of the ajax post is correct. But the .html
update is not working
The content is not changed after clicking the link.
For an anchor tag, you should be updating the text property. $('a.btn-like#'+like_id).text(data);