Mousedown on appended items

Question

The function below toggles the highlight on a cell when a user clicks the cell.

It works well if the cells are there when the document loads. However, it does not work on newly appended cells.

What could I change to make it work for new cells?

  $(function () {
  var isMouseDown = false,
    isHighlighted;

  $("#tablegrid td.nohighlight")
    .mousedown(function () {
      isMouseDown = true;
      $(this).toggleClass("highlighted");
      isHighlighted = $(this).hasClass("highlighted");
      return false; // prevent text selection
    })
    .mouseover(function () {
      if (isMouseDown) {
        $(this).toggleClass("highlighted", isHighlighted);
      }
    })
    .bind("selectstart", function () {
      return false;
    })

  $(document)
    .mouseup(function () {
      isMouseDown = false;
    });
});

score 0 · Accepted Answer · answered Oct 25 '18 at 15:33

0

$("#tablegrid").on('mousedown', 'td.nohighlight', function() {
....
}

Same stuff for 'mouseover' and 'bind'.

answered Oct 25 '18 at 15:33

Blallo

450
3
11

This question is a clear duplicate of the one linked. Vote to close as a duplicate rather than duplicating answers – Taplar Oct 25 '18 at 15:39
Awesome. That worked. Thank you. Will accept answer. – user749798 Oct 25 '18 at 15:39

Mousedown on appended items

1 Answers1