I'm struggling with a jquery ajax callback function to change the background color of a table cell. Despite no errors in Firebug, my code isn't working as expected.
Here's the code I have:
$(".tariffdate").click(function () {
var property_id = $('#property_id').attr("value");
var tariff_id = $('#tariff_id').attr("value");
var tariff_date = $(this).attr("id");
$.post("/admin/properties/my_properties/booking/edit/*", { property_id: property_id, tariff_id: tariff_id, tariff_date: tariff_date },
function(data){
var bgcol = '#' + data;
$(this).css('background-color',bgcol);
alert("Color Me: " + bgcol);
});
I've added the alert to confirm that I'm getting the correct hex code as expected, but still, the background color of my table cell won't change.
All table cells share the .tariffdate class, but also have unique IDs.
In a test, I tried creating a hover function for that class:
$(".tariffdate").hover(function () {
$(this).css('background-color','#ff0000');
});
The hover function works fine, which makes me even more confused about why the callback function isn't working. Any suggestions?