Rearrange dynamically visible controls on a page

Hello,

Here is what I am trying to do.I have a drop down list along with a 'Add' button (which are always visible). There are some other 'Label', 'TextBox', 'Button' in the page (which is not visible on load). Depending on the user selection from the first dropdown (and when click on 'Add' button), I would like to dynamically set some of the Controls visible.

For example (as per below code): When User selects 'Email' ... Label3, TextBox3 and Button3 will be visible. Again when user will click Button3, all controls will be invisible. I was able to Show and Hide those controls as per user selection and button click.

What I would like to do is, rearrange the controls. For example, If user selects 'Email' and click 'Add' button (Button5), It would display 'Label3', 'TextBox3', 'Button3'. Then if user selects 'Name' from the dropdown and click 'Add' ...