JSFiddle - React, Tailwind, and code Playground

by Rob Sedgwick

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.js"></script>
<div ng-app="app" ng-controller="Ctrl">
<i title="trev" style="cursor:pointer" markselected="" class="fa fa-square-o fa-xs" markable="" ng-click="selectChosenOption(datum, 'Field for Source')">billy</i>
<i title="trev" style="cursor:pointer" markselected="" class="fa fa-square-o fa-xs" markable="" ng-click="selectChosenOption(datum, 'Field for Source')">jimmy</i>
</div>

CSS

i.text-success {
    color: red;
}

JavaScript

var app = angular.module("app", []);

app.controller("Ctrl", function ($scope) {
//                alert("brother");
});

app.directive("markselected", function () {
    return {
        link: function (scope, elem, attrs) {
            elem.on("click", function () {
//                alert("mother");
                elem.addClass("text-success");
            });
        }
    };
});