title: append jquery does not work
body: <p>i am creating a search suggestion and i want to create a div and put suggestion elements like full name, image and ... in it.
  so i have a empty div in my HTML code that my suggestions will be added to it.</p>
  
  <pre><code>&lt;input type="text" name="query" autocomplete="off" id="base_main_search_box"&gt;
  &lt;button type="button" value="" id="base_main_search_box_button"&gt;&lt;/button&gt;
  &lt;div id="main_searchSuggestion"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>i want to appear search suggestions when user key up in input type.
  so i create jQuery function.
  my jQuery function is:</p>
  
  <pre><code>$('#base_main_search_box').keyup(function () {
      $.ajax({url:'http://localhost:8000/search_suggestion/',success:function(result){
              $(addSuggestion).append('&lt;div class="base_searchSuggestionItem"&gt;' +
                  '&lt;img src="' + result.movie_images[i] + '" class="base_searchSuggestionItem_image"&gt;' +
                  '&lt;div class="base_searchSuggestionItem_info"&gt;' +
                      '&lt;p class="base_searchSuggestionItem_info_name"&gt;' +
                          '&lt;a href=""&gt;' +
                              result.movie_names[0] +
                          '&lt;/a&gt;' +
                          '(' +
                          result.movie_yearProduction[0] +
                          ')' +
                      '&lt;/p&gt;' +
                      '&lt;p class="base_searchSuggestionItem_info_description"&gt;' +
                          result.movie_descriptions[0] +
                      '&lt;/p&gt;' +
                  '&lt;/div&gt;' +
              '&lt;/div&gt;');
              console.log('final: '+addSuggestion.innerHTML);
          }
      }});
  });
  </code></pre>
  
  <p>the output is:</p>
  
  <pre><code>"final: undefined"
  </code></pre>
  
  <p>it is not correct.</p>