Removing HTML element styles via JavaScript
dom, html, javascript, styles
Solution
you can just do:
element.removeAttribute("style")
Problem
I'm trying to replace an element's inline style tag value. The current element looks like this: ``` `<tr class="row-even" style="background: red none repeat scroll 0% 0%; position: relative; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" id="0000ph2009-06-10s1s02">` ``` and I'd like to remove all that style stuff so that it's styled by it's class rather than it's inline style. I've tried delete element.style; and element.style = null; and element.style = ""; to no avail. My current code breaks at these statement. The whole function looks like: function unSetHighlight(index){ ``` if(index < 10) index = "000" + (index); else if (index < 100) index = "000" + (index); else if(index < 1000) index = "0" + (index); if(index >= 1000) index = index; var mainElm = document.getElementById('active_playlist'); var elmIndex = ""; for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){ if(currElm.nodeType === 1){ var elementId = currElm.getAttribute("id"); if(elementId.match(/\b\d{4}/)){ elmIndex = elementId.substr(0,4); if(elmIndex == index){ var that = currElm; //that.style.background = position: relative; } } } } clearInterval(highlight); alert("cleared Interval"); that.style.background = null; alert("unSet highlight called"); } ``` the clearInterval works but the alert never fires and the background stays the same. What's the problem? ``` function unSetHighlight(index){ alert(index); if(index < 10) index = "000" + (index); else if (index < 100) index = "000" + (index); else if(index < 1000) index = "0" + (index); if(index >= 1000) index = index; var mainElm = document.getElementById('active_playlist'); var elmIndex = ""; for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){ if(currElm.nodeType === 1){ var elementId = currElm.getAttribute("id"); if(elementId.match(/\b\d{4}/)){ elmIndex = elementId.substr(0,4); alert("elmIndex = " + elmIndex + "index = " + index); if(elmIndex === index){ var that = currElm; alert("match found"); } } } } clearInterval(highlight); alert("cleared Interval"); that.removeAttribute("style"); //that.style.position = "relative"; //reColor(); alert("unSet highlight called"); } ```