JSFiddle - React, Tailwind, and code Playground
HTML
<div id="myDiv" style="margin: 50px 50px 50px 50px">This is a div.</div>
<br />
<button type="button" onclick="removemargin()">remove margin</button>
<button type="button" onclick="removeLeftMargin()">remove leftmargin</button>
<button type="button" onclick="removeTopMargin()">remove topmargin</button>
<button type="button" onclick="addCssMargin()">add margin by adding class (dominant here)</button>
CSS
#myDiv {
background: #EEE;
}
.myclass{
margin : 100px 10px 15px 50px !important;
background:red !important;
}
JavaScript
function removemargin() {
document.getElementById("myDiv").style.margin = "0";
}
function removeLeftMargin() {
document.getElementById("myDiv").style.marginLeft = "0";
}
function removeTopMargin() {
document.getElementById("myDiv").style.marginTop = "0";
}
function addCssMargin() {
var d = document.getElementById("myDiv");
d.className = d.className + " myclass";
}