- I want to display 5 user feedback messages in a span with the id 'messagefield'.
- I want the spans to be stacked on top of each other with the newest on top
- When 5 spans have stacked up, I want to remove them --> replace them with the following next 5 messages.
I want this endresult in the markup :
<div class="span4 messageField">
<span id="messagefield">Message 1</span>'
<span id="messagefield">Message 2</span>'
<span id="messagefield">Message 3</span>'
<span id="messagefield">Message 4</span>'
<span id="messagefield">Message 5</span>'
</div>
I have appended the first span messagefield to my div like this with jquery:
$('.messageField').prepend('<span id="messagefield"></span>');
Here is the click function that generates the text for the messagefield:
$("#fireCreate").click(function(e) {
$("#messagefield").html("Importerar titelsida, vänta ...");
});
this is the markup in the html:
<div class="span4 messageField">
<!-- HERE IS WHERE THE SPANS WILL STACK UP -->
</div>