jQuery attr() not working while dynamically updating it
<p>I am having trouble with jQuery attr(). Here is my code:</p>

<pre><code>$(document).ready(function(){
    var Religion = $("#Religion"),
        Hindu = $("#Hindu"), 
        Muslim = $("#Muslim"), 
        Christian = $("#Christian");

    Religion.change(function(){ 
        var sReligion = $(this).val();  

        if(sReligion=="1") {
            SelectCaste.css('display','none');
            Hindu.css('display','block');
            Hindu.attr('name','Caste');
            Muslim.css('display','none');
            Muslim.attr('name','');
            Christian.css('display','none');
            Christian.attr('name','');
        }
        else if(sReligion=="2") {
            Hindu.css('display','none');
            Hindu.attr('name','');
            Muslim.css('display','block');
            Muslim.attr('name','Caste');
            Christian.css('display','none');
            Christian.attr('name','');
        }
        else if(sReligion=="3") {
            Hindu.css('display','none');
            Hindu.attr('name','');
            Muslim.css('display','none');
            Muslim.attr('name','');
            Christian.css('display','block');
            Christian.attr('name','Caste');
        }
    });
});
</code></pre>

<p>If sReligion (actually a select box) value is set to '1', then the attribute is set for Hindu. i.e., 
<code>&lt;select name='Caste' id="Hindu"&gt;&lt;option value=''&gt;Select Caste&lt;/option&gt;...&lt;/select&gt;</code></p>

<p>But if i change the sReligion value, other than '1', then the attribute is not set and name=" ",  for other conditions.</p>

<p>Kindly suggest me a good solution.. </p>

<p>Thanks in advance...</p>
