Backbone/Handlebars SPA - how to keep home HTML off of other pages

Question

I'm having trouble wrapping my head around Single Page Applications. For example, I have a bootstrap carousel that I'm trying to keep on the home page and remove on other pages. I've been able to remove for other pages, but cannot seem to bring the HTML back when I click back on my home page. Any tips? I've tried with and without a template for the carousel itself.

Here is relevant app.js (attempted template for carousel is var template2):

var Router = Backbone.Router.extend({
    routes: {
        '': 'home',
        'users': 'users', // users does not exist
        // 'image_sets': 'image_sets', // this is the same as root of heroku api
        'images': 'images',
        'comments': 'comments',
        'likes': 'likes',
        'postImages': 'postImages',
        'image_sets/:id' : 'image_sets'
    },

    home: function() {
      $('.recent_imageset').empty();
      $('#content').empty();

      // $('#myCarousel').appendTo('body');
        $.ajax({
            url: 'https://pixelect-rails-api.herokuapp.com', // changed from /images
            type: 'GET'
        }).done(function(response) {
            // var parsedResponse = jQuery.parseJSON(response)
            // var object = response
            console.log(response);
            var template = Handlebars.compile($('#homePicSetsTemplate').html());
              $('.recent_imageset').html(template({
                picSet: response
            }));
            var template2 = Handlebars.compile($('#homePicTemplate').html());
              $('.myCarousel').html(template2({
            }));
        });
    },
    images: function() {
      $('#content').empty();
      $('#myCarousel').detach();

        $.ajax({
            url: 'https://pixelect-rails-api.herokuapp.com/images',
            type: 'GET'
        }).done(function(response) {
            console.log(response);
            var template = Handlebars.compile($('#imagesTemplate').html());
              $('#content').html(template({
                image: response
            }));
        });
    },

html script and start of carousel:

<script id="homePicTemplate" type="text/x-handlebars-template">
    <h1></h1>
</script>


<div id="myCarousel" class="carousel slide" data-ride="carousel">

Answer 1

As soon as I asked, I realized that .hide(); and .show(); existed. Almost too good to be true. No templating necessary.