how not to submit the form elemtns once it's hidden?

how not to submit the form elemtns once it's hidden?

Hello,

I have the following code working fine but the problem is that it always submits the first div (article) even though it's hidden.  My question is how do I submit the form and the elements in the form in the div that's shown?  (if I select Music radiobutton, I want to submit the input elements of the Music Div not the Article div.  Thanks.
    2. $(document).ready(function(){ 
    3.      $("input[name$='itemlist']").click(function() {
    4.        var selection = $(this).val();
    5.        $("div.box").hide();
    6.        $("#"+selection).show();
    7.    });
    8. });

    10. <!--radio buttons-->
    12. <div id="articleselection"><input name="itemlist" type="radio" value="article" /> Article/Book </div>
    13. <div id="musicselection"><input name="itemlist" type="radio" value="music" /> Music</div>

    15. <!--article div starts-->
    17. <div id="article" class="box">
    19. <table class="fieldgroup">
    20. <tr><td>Journal Title: <input id="JournalTitle" name="JournalTitle" type="text" size="60" class="f-name" tabindex="1" value="JournalTitle">
    21. </table>

    23. <table class="fieldgroup">
    24. <tr><td>Article Author: <input id="ArticleAuthor" name="ArticleAuthor" type="text" size="40" class="f-name" tabindex="2" value="<"ArticleAuthor"></td></tr>
    25. </table>
    26. </div>

    29. <!--music div starts-->
    30. <div id="music" class="box">
    31. <table class="fieldgroup">
    32. <tr><td>Music Title: <input id=" Music Title" name=" Music Title" type="text" size="60" class="f-name" tabindex="1" value=" Music Title">
    33. </table

    35. <table class="fieldgroup">
    36. <tr><td>  Music Author: <input id=" MusicAuthor" name=" Music Author" type="text" size="40" class="f-name" tabindex="2" value="<"MusicAuthor"></td></tr>
    37. </table>
    38. </div>