data-* doesn't update after click

Question

I am trying to update data-coords (11th line), but when I do it the code runs but the data-coords don't update. Why? It looks valid to me, am I missing something?

$(document).on('click', '.next-prev-js', function (e) {
    var item = e.target;
    if($(item).is("img") && tagging){
        var offset = $(item).offset();
        var imgid = $(item).attr("data-image-id");
        var obi = $("#blackout-image").offset();
        x = (e.clientX - offset.left);
        y = (e.clientY - offset.top);
        addTag(e.clientX - obi.left - 55, e.clientY - 55);
        saveCoords(x, y, imgid);
        $(item).attr("data-coords", x+","+y);
        tagging = false;
        $(".tag-self").text("Tag yourself");
        $("#blackout-image img").css({cursor: "pointer"});
        $("#blackout-image .face").delay(3000).fadeOut("fast");
        return false;
    }
    var action = $(item).attr("data-action");
    nextPrevImage(action);
    return false;
});

Here is the HTML portion (This is inside a php echo statement):

<a class='thumb-photo' href=''>
    <img class='thumb-img' data-coords='$x,$y' data-id='$id' data-image-id='$imid' data-file='$f' src='/user-data/images/image.php?id=$id&file=$f&height=240&width=240' width='240' height='240' />
</a>

Demo

(Don't refresh the page during this process)

If you click on one of the images, it will open in a viewer .

• On the left hover over "Where is He" and a square will show where the data-coords are (from thumbnail image)
• Next click on "Tag yourself", then click on a location in the image.
• Close the viewer by pressing "esc" or clicking on the transparent area
• Click on the image again, and mouse over "Where is He" the coords are still the old coords, but they should have been updated after you clicked on the new location

http://wows.phpsnips.com/profile.php?id=1&tab=photos

Answer 1

You should use the data method.

   $(item).data({coords: x+","+y});

or

   $(item).data("coords", x+","+y);

works in jsfiddle.

You can see your data attributes with:

   console.log($(item).data());