innerHTML не добавляющий html-контент

Question

Я считаю, что у меня почти такая работа. У меня уже есть нижний колонтитул, но когда кнопка нажата, она скользит вниз вместе с содержимым. После того, как он скользит вниз, я использовал javascript для удаления этого нижнего колонтитула и его содержимого, и я создал еще один элемент нижнего колонтитула. Я добавил его, чтобы включить div. Когда я проверяю элемент инспектора, он показывает новый нижний колонтитул и пустой div. Однако, когда я добавляю innerHTML к id div, он не заполняет его кодом. Вот код JavaScript:

var slide = document.getElementById('slide'); 
var info = document.getElementsByClassName('info'); 
var input = document.getElementById('input'); 
var footer = document.getElementById('footer'); 
var addFooter = document.createElement('footer'); 
var newFooterContent = '<div class="col-md-8 col-md-offset-2"><input type="text" class="form-control move-right" size="105" placeholder="Say &ldquo;Hello&rdquo; or whatever else is on your mind"> </div> <div class="col-md-2"> <button type="submit" class="btn btn-default">Submit</button> </div>' 



$(document).ready(function() { 
    $("#hidePic").click(function(e) { 
     e.preventDefault(); 
     $("#slide").slideToggle("fast", function() { 
      footer.parentNode.removeChild(footer); 
      document.body.appendChild(addFooter); 
      addFooter.appendChild(input); 
      input.addInnerHTML = newFooterContent; 
     }); 
    }); 
}); 

Answer 1

Заменить

input.addInnerHTML = newFooterContent; 

с

input.innerHTML = newFooterContent; 

и он должен работать