Treebook Handlebars Helpers Video - dropdown won't un-toggle

Question

I successfully created the dropdown for the activity feed on Treebook, and when I click on the Activity Feed link in the navbar the list of activities drops down, but it does not go away when I click on the link again, or when I click elsewhere on the page. It only goes away when I navigate away from the page. Here is my application.js code:

//= require jquery
//= require jquery_ujs
//= require js-routes
//= require_tree .

window.loadedActivities = [];

var addActivity = function(item) {
    var found = false;
    for (var i = 0; i < window.loadedActivities.length; i++) {
        if (window.loadedActivities[i].id == item.id) {
            var found = true;
        }
    }

    if (!found) {
        window.loadedActivities.push(item);
    }

    return item;
}

var renderActivities = function() {
  var source = $('#activities-template').html();
  var template = Handlebars.compile(source);
  var html = template({activities: window.loadedActivities});
  var $activityFeedLink = $('li#activity-feed');

  $activityFeedLink.addClass('dropdown');
  $activityFeedLink.html(html);
  $activityFeedLink.find('a.dropdown-toggle').dropdown();
}

var pollActivity = function() {
  $.ajax({
    url: Routes.activities_path({format: 'json', since: window.lastFetch}),
    type: "GET",
    dataType: "json",
    success: function(data) {
      window.lastFetch = Math.floor((new Date).getTime() / 1000);
      if (data.length > 0) {
        for (var i = 0; i < data.length; i++) {
          addActivity(data[i]);
        }
        renderActivities();
      }
    }
  });
}

// window.pollInterval = window.setInterval( pollActivity, 5000 );

And this is in my views/layouts/application.html.erb file:

</body>

<script id="activities-template" type="text/x-handlebars-template">
    <a class="dropdown-toggle" href="#">Activity Feed</a>
    <ul class="dropdown-menu">
    {{#each activities}}
        <li><a href="#">{{this.user_id}} {{this.action}} a {{this.targetable_type}}.</a></li>
    {{/each}}
    </ul>
</script>

</html>

I'd appreciate any clues as to why my dropdown will not toggle off. Thanks!

Welcome to the Treehouse Community

Looking to learn something new?

Rose Weixel

Rose Weixel

Treebook Handlebars Helpers Video - dropdown won't un-toggle