Change CSS class of a button

[micah]

I'm trying to create a function which removes the class of a button and then adds another class:

$scope.tutorialShow = function () {
 angular.element(document.querySelector("[widget-id=instructionInfoButton] button")).removeClass("test").addClass("button");
}

I'm not sure the error in my code.

[WilsonT · Accepted solution]

Hi Micah,

Can you try the following?

$scope.tutorialShow = function () { 
  $scope.setWidgetProp('instructionInfoButton','class',undefined);
  $scope.setWidgetProp('instructionInfoButton','class','button');
}

[rabernathy]

I believe the quotes around the widget id are not correct in your code.  Here is an example from an experience I've created:

angular.element(document.querySelector('[widget-id="PartIDListGrid"] .row:nth-child(2)')).addClass("SelectedItem");

I think yours should be (I didn't test):

angular.element(document.querySelector('[widget-id="instructionInfoButton"] button')).removeClass("test").addClass("button");