I have modified your code.
I used this line to clear the TexBox.
$('#txtPercenFlat').val('');
and this for making the TextBox editable
$('#txtPercenFlat').removeAttr('disabled');
Your edited HTML code
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('#<%= rbFlatRoof.ClientID %>').click(function () {
var radioSelectedValue = $(this).find('input[type=radio]:checked').val()
if (radioSelectedValue == 'Y') {
$('#divPercentFlatRoof').slideDown('fast');
$('#txtPercenFlat').removeAttr('disabled');
}
else {
$('#divPercentFlatRoof').slideUp('fast');
$('#txtPercenFlat').val('');
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:Label ID="lblFlatRoof" runat="server" Text="Does any part of you house have a flat roof"></asp:Label>
<asp:RadioButtonList ID="rbFlatRoof" runat="server">
<asp:ListItem Text="No" Value="N"></asp:ListItem>
<asp:ListItem Text="Yes" Value="Y"></asp:ListItem>
</asp:RadioButtonList>
<asp:RequiredFieldValidator ID="flatRoofRequirdFieldValidator" runat="server" ErrorMessage="Please select a value"
ControlToValidate="rbFlatRoof" InitialValue="" Display="Dynamic" ValidationGroup="phValidationGroup"
SetFocusOnError="true">
</asp:RequiredFieldValidator>
<div id="divPercentFlatRoof" style="display:none">
<asp:Label ID="lblPercenFlat" runat="server" Text="If yes, percentage flat roof:"></asp:Label>
<asp:TextBox ID="txtPercenFlat" runat="server" MaxLength="2" Columns="2" Enabled="false"></asp:TextBox>
</div>
</form>
</body>
</html>