Question

I have a div element (#receivedInfo) with p elements inside of it. Each p element has a date in it. I managed to take out this date from each element and compare it to the current date.
After I compare each element to the current date, I want to move them in two divs:

• one to contain all elements that have a date higher than the current date (“.licitatiiActive“)
• the other to contain all the elements that have a lower date than the current date (“.licitatiiInactive“)

I managed to do the comparison, but all I can move is only one element.

Here is the HTML I use:

<div id="receivedInfo" class="hidden">
    <p>16.10.2012 - <a href="#">test line 1</a></p>
    <p>16.10.2012 - <a href="#">test line 2</a></p>
    <p>16.10.2012 - <a href="#">test line 3</a></p>
    <p>16.10.2012 - <a href="#">test line 4</a></p>
</div>
<div class="licitatiiActive"></div>
<div class="licitatiiInactive"></div> 

And here is the jQuery I use:

var fullDate = new Date();
var twoDigitMonth = (fullDate.getMonth()+1)+"";
if(twoDigitMonth.length==1) twoDigitMonth="0" +twoDigitMonth;
var twoDigitDate = fullDate.getDate()+"";
if(twoDigitDate.length==1)  twoDigitDate="0" +twoDigitDate;
var currentDate = twoDigitDate + "." + twoDigitMonth + "." + fullDate.getFullYear();

var dataLic;
var infoP;

$.each($("#receivedInfo p"), function () {
    var info = $(this).html();
    dataLic = info.split(' - ')[0].trim();
    infoP = "<p>" + info + "</p>";

});
if (dataLic > currentDate) {
        $(".licitatiiInactive").html(infoP);
    } else {
        $(".licitatiiActive").html(infoP);
    }

As mentioned, the result is that only the first p element from div “#receivedInfo” is being moved to the div “.licitatiiInactive“.
How can I adjust this script to move each element of “#receivedInfo” to the proper div?

Answer 1

Relevant part outside loop and same sample date

I was astonished at first since my debug attempt with chrome dev tools and a console.log showed the same date every time. The reason was that every sample date was / is the same.

Below you can see a working solution. The var dataLic is filled in the each-loop and its current value is handled by appendDate.

$.each($("#receivedInfo p"), function () {              
    dataLic = $(this).html().split(' - ')[0].trim();                
    console.log("dataLic", dataLic, "currentDate", currentDate);        
    appendDate(dataLic, currentDate);
});

function appendDate(dataLic, currentDate){
    if (dataLic > currentDate) {
        $(".licitatiiInactive").append(dataLic +"<br/>");
    } else {
        $(".licitatiiActive").append(dataLic+"<br/>");
    }   
}

Update bug found and sample online

It was quite simple to find the bug after i changed the sample dates.
You are looping over each date with $.each but your code to copy the values is outside the loop. If you put your code (see my function appendDate()) inside the loop every single value will be handled and not just the last one.
Please take a look at a working solution to copy the elements