Как показать введенные данные в другом div?

Question

Я должен ввести данные по одному и после нажатия ADD BUTTON данные должны быть добавлены и показаны другим div. Я использую html, * css * и javascrit. таких же, как торговых площадок i.e. Один за другим добавляем товар и он отображается в cart.

Я новичок в веб-дизайне, пожалуйста, помогите.

Answer 1

Here is working demo

Html:

<a href="#" class="design_button add">Click here to add Product</a> 
<div id="this_div_contains_settings"></div> 

JQuery:

$(function(){ 
    var number = 1; 
    $('a.add').click(function(e){ 
     e.preventDefault(); 
     $('#this_div_contains_settings').append('<div id="settings'+number+'">Product Item.<a href="#" class="design_button">Remove this Product</a></div>'); 
     number++; 
    }); 
    $('#this_div_contains_settings').on('click','a.design_button', function(e){ 
     e.preventDefault(); 
     $(this).parent().remove(); 
    }); 
}); 

Answer 2

Это может быть первым демо, которые будут использоваться, чтобы узнать

<div id="console"></div> 
<input id="input" type="text"> 

<button id="trigger">Click me!</button> 

<script> 
document.getElementsById("trigger").onclick = function() { 
    document.getElementById("console").innnerHTML = document.getElementById("input").value; 
} 

</script>