Meteor execution of jQuery events

Question

I'm trying to get a grasp of how to properly execute jQuery code in meteor. I have some pretty simple examples that are failing. here is my view:

    <template name="fixedSidebar">
        <div data-spy="affix" class="bs-docs-sidebar col-md-2 sidebar">
          <ul class="nav bs-docs-sidenav navbar-li menuList">
            <li>
              <a href="#alerts" id="testID">Alerts</a>
            </li>
            <li>
              <a href="#contacts">Contacts</a>
            </li>
            <li>
              <a href="#chats">Chats</a>
            </li>
            <li>
              <a href="#projects">Projects</a>
            </li>
          </ul>
          <div id="target">
              Click here
          </div>
        </div>
    </template>

and here is the JQuery:

    if (Meteor.is_client) {
        Template.fixedSidebar.rendered = function(){
            $(".menuList").click(function(){
                alert("Content has been clicked");
            });

            $("#testID").click(function(){
                alert("Alerts has been clicked");
            });

            $( "#target" ).click(function() {
              alert( "Handler for .click() called." );
            });
        };
    }

None of these click events are firing an alert. I'm going to look at meteor events as well but I'd like to know why my JQuery isn't running. I've confirmed the js file is getting loaded by meteor.

Answer 1

Probably the easiest way to implement Meteor.isClient and Meteor.isServer and definitely best practice in my book is to create two folders in your root directory Client and Server. Then everything that is client side is placed in the Client folder and everything that is on the server side is placed in the Server folder. You don't have to use Meteor.isClient or Meteor.isServer if done this way.

Also, you can create a folder called shared and place your code that gets used by both client and server in there.