Skip to content
Advertisement

JavaScript remove class from table rows

I have a table that highlight the tr (row) on click, and I can highlight multi rows on every click but I want to have only one row to be highlight in table. how to remove the highlight class from sibling rows. code below

JavScript

        document.querySelector("table").addEventListener("click", function (e) {
            // Is it a click on a tr in this table?
            var tr = e.target.closest("tr");
            if (tr && this.contains(tr)) {
                // Yes, toggle highlight
                tr.classList.toggle("highlight");
            }
        });

css

  .highlight {
        background-color: #ffeaea;
    }

Advertisement

Answer

I ended up adding below code and issue resolved.

 $('.table tr').removeClass("highlight");
User contributions licensed under: CC BY-SA
2 People found this is helpful
Advertisement