how to add div id after page loading

Question

I want to add div dynamically for particular html

Here, i will give you small example

<input id="radio1" type="radio" name="rad" value="rad" title='Yes' alt='yes'>

while clicking radio button, i need to add one div, like :

 <div id='A1' class='redColourIndicatin'>
    <input id="radio1" type="radio" name="rad" value="rad" title='Yes' alt='yes'>
 </div>    

Is it possible to add Div Id, after loading the page?

My intention is not to add only class to radio button. we need to some other manipulations also?

please give idea, how to add

Answer 1

$('#radio1').click(function()
   if ($(this).parent().attr('id') !== 'A1') {
      $(this).wrap('<div class="redColourIndicatin" id="A1" />') 
   }
});

it's not clear if class or id are static or if you want retrieve dinamically. What you're trying to do it's a wrapper

Make a check before wrap(), otherwise you will create a wrapper every time you click on the input

Answer 2

Try this solution:

addID in jQuery?

And after seeing your edit you can try this thread:

Creating a div element in jQuery

Answer 3

You can use the attr() method.

$(selector).attr("id", "yournewID");

in your example

$(document).ready( function () {
  $("input#radio1").click(function () {
    var mydiv = $("<div></div>");
    mydiv.attr("id", "radio1");
      .addclass("redColourIndicatin");
    $(this).wrap(mydiv);
  });
});

Answer 4

If you can find the div in the DOM using javascript, you can manipulate that element's id by setting the id attribute to whatever you want:

//finding the element by class name:
var myElement = document.getElementsByClassName('myDivsClassName')[0];
myElement.id = 'newID';