Dynamically generated textfield not showing the value set by javascript
<p>I have a dynamically generated textfield (using the following code):</p>

<pre><code>echo "&lt;div&gt;&lt;table width='100%'&gt;&lt;tr&gt;
         &lt;td&gt;
             Date: &lt;input type='text' class='span2' id='currDate'&gt;
         &lt;/td&gt;&lt;td rowspan='2'&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
</code></pre>

<p>This field is generated once a user presses a button, this button links to a javascript:</p>

<pre><code>$('#receipts button').live('click', function(){
        var id = this.id;
        $.ajax({
            type: "post", url: "receipt-stock.php", data: "production_detail_id="+id,
            success: function(data) {
                $('.modal-body').html(data);
                $('#new_receipt').modal('show');
                var myDate = new Date();
                var prettyDate = myDate.getDate()+'-' +(myDate.getMonth()+1)+'-'+myDate.getFullYear();
                $("#currDate").val(prettyDate);
                $('#currDate').datepicker({ dateFormat: 'dd-mm-yy' });
            }
        });
    });
</code></pre>

<p>As it can be seen from the javascript i am displaying a modal which contains the textfield from the code above. Everything works fine except the part where i am setting the value of <code>#currDate</code> to the current date, the textfield does not show anything nether it shows the date-picker when in focus.</p>

<p><strong>However upon using alert i found that the textfield has the value i want, it just doesn't  display it.</strong></p>
