title: How to remove css element that targets table with javascript
body: <p>I'm trying to remove a bit of css from a certain page as I'm using an Google Org Chart in my drupal site and some of my css is overriding what is already there. Here is the code below.</p>
  
  <p>What I want to remove:</p>
  
  <pre><code>.MainBlock table td {
     border-right: 1px solid #045273;
     border-bottom: 1px solid #045273;
     vertical-align: top;
  }
  </code></pre>
  
  <p>I've tried a number of things, but nothing has worked. All attempts that I haven't removed are below.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    if (document.URL.indexOf("/node/7794/draft") &gt;= 0) {
    //$('.MainBlock').find("table tr").css("border-bottom","");
    //$(".MainBlock table td").css("border-bottom":"12px Solid #000");
    $(".MainBlock table td").css({ 'border-bottom' : ''});
  }
  </code></pre>
  
  <p>I need it to ignore that line of css, as it's needed on other pages. That, and setting it to 0 or none sort of breaks it. </p>