Access HTML DOM from Javascript file (Meteor)

Question

I'm not sure if this is a good question or even a right approach but I'm just wondering how I could possibly disable a button from my JS file using Meteor.

I attempted

$("#button").disabled = true;

And it didn't work. I'm not sure if this is the right approach or not. I thought of maybe creating a function under a script tag in my HTML file but I thought that would seem redundant considering I have a JS file which represents my model so I was just attempting on figuring out if I can access HTML tags from that file.

Here's the code:

Users = new Mongo.Collection("user-info");
if (Meteor.isClient) {
  var myApp = angular.module('calorie-counter',['angular-meteor']);

  myApp.controller('formCtrl',['$scope',function($scope) {
  $("#button").disabled=true;

  $scope.calories;
  $scope.goal;
  $scope.user;

  $scope.submit = function() {
    Meteor.call("submit",$scope.user);
    $scope.clear();
  }

  $scope.clear = function() {
    $scope.user = {
      item1:'',
      item2:'',
      calories:'',
      goal:''
    };

  }

 }]);
}

Answer 1

First, I'm not angularjs user. But your code must to run template render after. try to change your code like below. (Note: "yourTemplate" change to yours)

Users = new Mongo.Collection("user-info");

if (Meteor.isClient) {

  Template.yourTemplate.onRendered(function() {

    var myApp = angular.module('calorie-counter', ['angular-meteor']);

    myApp.controller('formCtrl', ['$scope',
      function($scope) {
        $("#button").disabled = true;

        $scope.calories;
        $scope.goal;
        $scope.user;

        $scope.submit = function() {
          Meteor.call("submit", $scope.user);
          $scope.clear();
        }

        $scope.clear = function() {
          $scope.user = {
            item1: '',
            item2: '',
            calories: '',
            goal: ''
          };

        }

      }
    ]);
  });
}