Feedback on Practice Site I made

var $modal = $("#modal");
$modal.hide()
//submit form
$("form").submit(function(e) {
    //prevent from leaving the page and submitting
    e.preventDefault();
    //set the variables
    var $search = $("#search");
    var blank = "";
    //get value of #search 
    var username = $search.val();
    var resultsSubheadingHTML = username + " has "; 
    var $resultsSubheading = $(".results-subheading");
    //remove whitespace
    username = username.toLowerCase();
    username = username.replace(/\s/g,"");
    var badgesJSON = "https://teamtreehouse.com/" + username + ".json";
    var success = false;
    var $modalImage = $(".modal__img");
    var $modalText = $(".modal__text");
    var errorSearch = '<p class="info warning">Sorry, user doesn\'t exist!</p>';
    //html function
    function html(selector, toAdd) {
        selector.html(toAdd);
    }
    //rotate function
    function rotate(degree) {
        if(!success) {
            $modalImage.css({
                '-webkit-transform': 'rotate(' + degree + 'deg)',
        '-moz-transform': 'rotate(' + degree + 'deg)',
        '-ms-transform': 'rotate(' + degree + 'deg)',
        '-o-transform': 'rotate(' + degree + 'deg)',
        'transform': 'rotate(' + degree + 'deg)',
        'zoom': 1
            });
            setTimeout(function() { rotate(++degree); },15);
        }
    } //end rotate function

    //searching $modalImage
    $modal.show()
    rotate(30);



    // check if title property exists
    function checkProperty(courses) {
        if (courses.length > 0) {
            return courses[0].title;
        } else {
            return "No Course";
        }
    }
    function displayBadges(response) {
        //if json request passes, success is true
        var badgesHTML = '<ul>';
        var counter = 0;
        //iterate through the badges
        $.each(response.badges, function(index, badge) {
            //until anchor
            badgesHTML += '<li class="ib-4"> <a href="' + badge.url + '" class="badge" target="_blank">';
            //badge image   
            badgesHTML += '<div class="badge__container card"> <div class="badge__img-container">';
            badgesHTML += '<img src="' + badge.icon_url + '"' + 'alt="' + badge.name + '" class="badge__img"> </div>';
            //start badge text
            badgesHTML += '<div class="badge__text card__text">'; 
            //Achievement
            badgesHTML += '<h3 class="badge__text__subheader">Achievement</h3>';
            //Badge Name
            badgesHTML += '<h2 class="badge__text__name">' + badge.name + '</h2>';
            //Badge Course
            badgesHTML += '<p class="badge__text__course">' + checkProperty(badge.courses) + '</p>'; 
            //end badge text
            badgesHTML += '</div>';
            //end badge__container
            badgesHTML += '</div>'
            //end anchor and li
            badgesHTML += '</a> </li>';
            counter += 1;
        }); //end each
        badgesHTML += '</ul>';
        resultsSubheadingHTML += counter + " achievements:";
        resultsSubheadingHTML = resultsSubheadingHTML.toUpperCase(); 
        //append HTML to #badges-grid
        html($("#badges-grid"), badgesHTML);
        //append to .results-subheading
        html($resultsSubheading, resultsSubheadingHTML);
        $search.val(blank);
        $modal.hide(); 
        success = true; 
    }//end displayBadges

    $.getJSON(badgesJSON, displayBadges).fail(function(){
        $search.val("");
        html($modalText, blank);
        html($modalText, errorSearch);
        //click modal bg to exit
        $modal.click(function(){
            $(this).hide();
            html($modalText, blank);
        });
        success = true;
    });
});//end form submit