JSFiddle - React, Tailwind, and code Playground

by shruti patil

HTML

<!DOCTYPE html>
<html ng-app="" ng-controller="myCtrl">
<body>

<div id="links">
  <table class="c-table">
    <thead>
      <tr>
        <th colspan="2">Sales Metrics</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td class = "tagid"><a id = "anchor">Volume Growth (MoM)</a></td>
        <td><span id="salesVolumeGrowthMoM"></span></td>
      </tr>
      
      

    </tbody>
  </table>
</div>
<button class="button" ng-class="{'active': isActive}" ng-click="activeTrends()" type="button">Trends</button>
</body>
</html>

CSS

.isDisabled {
  color: black;
  cursor: none;
  opacity: 0.5;
  text-decoration: none;
  pointer-events: none;
}
.isEnabled {
  color: blue;
  cursor: none;
  
  text-decoration: underline;
  pointer-events: none;
}

JavaScript

var count =0;

function myCtrl($scope) {
   
    $scope.activeTrends = function() {
    	var myEl = angular.element( document.querySelector( '#anchor' ) );
        alert(myEl.attr('myattr'));
    };
}

/*  $('button').on('click',function() {
 
 count++;
    //even odd click detect 
    var isEven = function(someNumber) {
        return (someNumber % 2 === 0) ? true : false;
    };
    // on odd clicks do this
    if (isEven(count) === false) {
     document.getElementById("anchor").setAttribute("href","#");
 //   $('.tagid').removeClass("isDisabled");
    
    
          //$('.tagid').replaceUrl();
    }
    // on even clicks do this
    else if (isEven(count) === true) {
    document.getElementById("anchor").removeAttribute("href");
   //$('.tagid').removeAttr('href');
   // $('.tagid').addClass("isDisabled");
    }
 
 
 
 });
 */