I am attempting to display an array containing the IDs of div elements when a user clicks on one of the divs. However, my current code keeps replacing the existing values in the array instead of adding to it. As a result, I only get one, two, or three as outputs, rather than one,two,three as desired. I suspect that the issue lies with how I am using the click function, but I'm not entirely certain.
<div class="status" id="one">1</div>
<div class="status" id="three">333</div>
<div class="status" id="two">22</div>
<p id="demo">The array.</p>
$('.status').click(function() {
var status = $(this).attr('id');
var list = [];
list.push(status)
//alert(status);
var x=document.getElementById("demo");
x.innerHTML=list;
});
Here's a Fiddle for you to test: http://jsfiddle.net/3zDZC/