Add st, nd, rd and th suffix to a number
<p>I would like to dynamically generate a string of text based on a current day. So, for example, if it is day 1 then I would like my code to generate = "Its the &lt;dynamic&gt;1*&lt;dynamic string&gt;<em>st</em>&lt;/dynamic string&gt;*&lt;/dynamic&gt;".</p>

<p>There are 12 days in total so I have done the following:</p>

<ol>
<li><p>I've set up a for loop which loops through the 12 days.</p></li>
<li><p>In my html I have given my element a unique id with which to target it, see below:</p>

<pre><code>&lt;h1 id="dynamicTitle" class="CustomFont leftHeading shadow"&gt;On The &lt;span&gt;&lt;/span&gt; &lt;em&gt;of rest of generic text&lt;/em&gt;&lt;/h1&gt;
</code></pre></li>
<li><p>Then, inside my for loop I have the following code:</p>

<pre><code>$("#dynamicTitle span").html(i);
var day = i;
if (day == 1) {
    day = i + "st";
} else if (day == 2) {
    day = i + "nd"
} else if (day == 3) {
    day = i + "rd"
}
</code></pre></li>
</ol>

<p>I hope my question is clear enough. If not then please accept my apologies. I am very new to all this and struggle explaining things.</p>

<p><em>UPDATE</em></p>

<p>This is the entire for loop as requested:</p>

<pre><code>$(document).ready(function () {
    for (i = 1; i &lt;= 12; i++) {
        var classy = "";
        if (daysTilDate(i + 19) &gt; 0) {
            classy = "future";
            $("#Day" + i).addClass(classy);
            $("#mainHeading").html("");
            $("#title").html("");
            $("#description").html("");
        } else if (daysTilDate(i + 19) &lt; 0) {
            classy = "past";
            $("#Day" + i).addClass(classy);
            $("#title").html("");
            $("#description").html("");
            $("#mainHeading").html("");
            $(".cta").css('display', 'none');
            $("#Day" + i + " .prizeLink").attr("href", "" + i + ".html");
        } else {
            classy = "current";
            $("#Day" + i).addClass(classy);
            $("#title").html(headings[i - 1]);
            $("#description").html(descriptions[i - 1]);
            $(".cta").css('display', 'block');
            $("#dynamicImage").attr("src", ".." + i + ".jpg");
            $("#mainHeading").html("");
            $(".claimPrize").attr("href", "" + i + ".html");
            $("#dynamicTitle span").html(i);
            var day = i;
            if (day == 1) {
                day = i + "st";
            } else if (day == 2) {
                day = i + "nd"
            } else if (day == 3) {
                day = i + "rd"
            } else if (day) {
            }
        }
    }
</code></pre>
