Format Date using CSR (dd.MM.yyyy)

Question

I´m using SP2013 and i have a Shift Plan which colors the row from TODAY in yellow.

 var today = new Date();
        // zero out the time portion so we will only compare days
        today.setHours(0,0,0,0);

        var rows = ctx.ListData.Row;
        for (var i = 0; i < rows.length; i++) {

            // get the date set in your date YourDateField
            var itemDate = new Date(rows[i]['Datum']);
            // zero out the time portion so we only compare days
            itemDate.setHours(0,0,0,0);


            var rowId = GenerateIIDForListItem(ctx, rows[i]);
            var row = document.getElementById(rowId);

            console.log(today, itemDate)
            //if (itemDate == today) {
            if(itemDate.getTime() == today.getTime()) {
                row.style.backgroundColor = '#FAE300';

This works perfect if my Regional Setting ist US.

console.log(today, itemDate) says:
Wed Aug 10 2016 00:00:00 GMT+0200 (Mitteleuropäische Sommerzeit) 
Thu Oct 27 2016 00:00:00 GMT+0200 (Mitteleuropäische Sommerzeit)

But i want the Regional Setting to be German. So, if i Change the Region to German, i get the right Format for Todays Date with:

var newDate = today.toLocaleDateString();

But i habe no Idea, how to Change the Date in the Coloumn "Datum"

console.log(newDate, itemDate)
10.8.2016 
Tue Nov 08 2016 00:00:00 GMT+0100 (Mitteleuropäische Zeit)
10.8.2016 
Thu Dec 08 2016 00:00:00 GMT+0100 (Mitteleuropäische Zeit)
10.8.2016 
Invalid Date

With Region German, SP has the format mm.dd.yyyy. I have no Idea, how to Change this in the Format dd.mm.yyyy like it is in my Rows: 11.08.2016, 12.08.2016, 13.08.2016.

Any Ideas?

UPDATE 1 i used the code from Patrick with moment.js

SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() 
{
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
    OnPostRender: function(ctx) 
    {

        var rows = ctx.ListData.Row;

        for (var i = 0; i < rows.length; i++) 
        {

            var today = new Date();
            var dispDate = moment(today).format("DD.MM.YYYY");
            var date = rows[i]['Datum'];
            var dispDateFromList = moment(date).format("DD.MM.YYYY");

            console.log(dispDate); // today
            console.log(dispDateFromList); // date from list

            if(dispDate == dispDateFromList) 
            {       
                var rowId = GenerateIIDForListItem(ctx, rows[i]);
                var row = document.getElementById(rowId); 
                row.style.backgroundColor = '#FAE300';
            }

        }
    }
}); 
});

The today is working fine. Today it is: for each line 11.08.2016 But the reading from list doens´t work.

It´s a bit strange. Chrome Browser interprets it different than IE and FF. Chrome:

dispDate:11.08.2016
dispDateFromList:Invalid date
dispDate:11.08.2016
dispDateFromList:Invalid date
dispDate:11.08.2016
dispDateFromList:Invalid date
dispDate:11.08.2016
dispDateFromList:11.01.2016
dispDate:11.08.2016
dispDateFromList:11.02.2016
dispDate:11.08.2016
dispDateFromList:11.03.2016
dispDate:11.08.2016
dispDateFromList:11.04.2016

For IE and FF dispDateFromList is always an Invalid date

My Row in the List is:

Answer 1

There are 2 functions SharePoint provides making Date calculations and formatting a whole lot easier:

• GetDaysAfterToday()
  https://sharepoint.stackexchange.com/search?tab=votes&q=user%3a32871%20GetDaysAfterToday

• String.format()
  Changing date format using javascript

Answer 2

Here the script:

<script type="text/javascript" src="/_catalogs/masterpage/Somnio/js/moment.js"></script>
<script type="text/javascript">

SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() 
{
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        OnPostRender: function(ctx) 
        {

            var rows = ctx.ListData.Row;

            for (var i = 0; i < rows.length; i++) 
            {

                var today = new Date();
                var dispDate = moment(today).format("DD.MM.YYYY");
                var date = rows[i]["date"];
                var dispDateFromList = moment(date).format("DD.MM.YYYY");

                console.log(dispDate); // today
                console.log(dispDateFromList); // date from list

                if(dispDate == dispDateFromList) 
                {       
                    var rowId = GenerateIIDForListItem(ctx, rows[i]);
                    var row = document.getElementById(rowId); 
                    row.style.backgroundColor = '#FAE300';
                }

            }
        }
    }); 
});

</script>

And here the output (date column as friendly):

Here the output (date column not friendly):

I saved the script as an .txt and added it to the webpart over an content editor and in that webpart properties via the link to the .txt

Maybe not the "best" way, but a way, I could say, works.

Tested with an custom list, one title column (single line of text) and one column called date (date and time, shown only date and formated friendly) as your requirement.

Hope this helps.