I have created a list with type Choice and set Description for the same. I have set Radio Buttons as "Display Choices Using". When i click on Add New item the Description is shown at the bottom. Is there any way we can show the description on "Top" using Jquery/Designer/CSS with out loosing the UI Format. Attached image is an exampleenter image description here

I know we can do it through infopath but i have some Java script in the Edit item.aspx page so using Infopath doesnot suite this requiremen

  • View source on the markup to find the selectors, you should be able to use jquery to detach it and prepend it to the container to move it above the radio options. Commented Jul 25, 2014 at 4:09
  • Eric thanks for your reply. I am just a starter in jquery can you please post with an example please. Commented Jul 25, 2014 at 4:29

2 Answers 2


I'm sure there is room for improvement, but here is a working sample.

jQuery(document).ready(function () {

    //narrow down matching to dialog boxes only
    if(location.href.indexOf('IsDlg=1') !== -1)
           $(".ms-dialog td.ms-formbody > span > table > tbody > tr:first-child > td > span.ms-RadioText").each(function(){

               //console.log('found the first option of the current choice list');

               var descriptionElement = $(this).closest('.ms-formbody').contents().filter(function(){ return this.nodeType != 1; });
               var descriptionText = $(descriptionElement).text();
               $(this).closest('.ms-formbody').prepend('<span>' + descriptionText + '</span>');

  • You are Awsome :-). But it worked after removing this line from your code. (if(location.href.contains('&IsDlg=1'))) Commented Jul 25, 2014 at 17:17
  • yep, that is if you are using dialogs Commented Jul 25, 2014 at 17:18
  • but what if i have more than 2 choice fields in the list ?? it is only working for 1st choice any help is really appreciated... please Commented Jul 25, 2014 at 17:22
  • it is your lucky day I guess Commented Jul 25, 2014 at 17:32
  • You are too great..... infinity thanks to your work. You made me so lucky ..... Do you have any blog where i can follow up you Commented Jul 26, 2014 at 4:28

Thanks for Tiago for providing the solution. So here is the code if you want to move description up for Multiple lines of text.

$("td.ms-formbody > span > textarea.ms-long").each(function(){

 var descriptionElement = $(this).closest('.ms-formbody').contents().filter(function(){ return this.nodeType != 1; });
  var descriptionText = $(descriptionElement).text();
 $(this).closest('.ms-formbody').prepend('<span>' + descriptionText + '</span>');
  • 2
    it is not very nice to throw away ones effort by selecting your own question as answer, when it doesnt even answer the question you originally asked, and kindly answered by me Commented Jul 28, 2014 at 18:16
  • 1
    You should really mark Tiago's answer as the Accepted answer, since he actually have you the solution.
    – Benny Skogberg
    Commented Jul 28, 2014 at 18:47
  • Sorry first I marked your solution only. Later I marked my answer for multiple line of text. O will in mark my answer. Really sorry and don't think bad Commented Jul 29, 2014 at 2:50
  • @sandy_9866141457 Good sports Sandy! I've linked your answer to Tiagos and changed my down vote to an upvote. Thanks for participating in our Community!
    – Benny Skogberg
    Commented Jul 29, 2014 at 6:43
  • This is not working in Sharepoint 2013. Any change in that? have you tried the same Commented Oct 14, 2015 at 14:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.