html - jQuery change <span> into <label> and add for="" with previous <input> id -

i have jquery turn selected spans labels.

the problem have need add in for="" works button (i'm using radio buttons input hidden it's box - therefore label needs have id of input in order work). know need create variable i'm not sure how write it.

what need (and correct me if i'm wrong) variable creates <label> tag + for="" id of previous input within "".

now these radio buttons brought in module though cms i'm using can't target id name different every time , generated cms. js needs target 'previous/parent' input tag.

so need final code after js has run:

<div class="wrapper"> <input type="radio" id="radio1" name="radios" value="sml">    <label for="radio1">small</label> <input type="radio" id="radio2" name="radios" value="med">    <label for="radio2">meduim</label > <input type="radio" id="radio3" name="radios" value="lrg">    <label for="radio3">large</label > </div> 

help please!

</script>    <script type="text/javascript">     $( document ).ready(function() {      jquery.each($(".wrapper span"), function() {      $(this).replacewith("<label>" + $(this).text() + "</label>");      });    });  </script>

input[type=radio] {      display:none;       margin:10px;  }    input[type=radio] + label {      display:inline-block;      margin:0;      padding: 8px 15px;      background-color: #eeeeee;      border-color:none;  	text-transform:uppercase;  	color:#bdbdbd;  	cursor:pointer;    }    input[type=radio]:checked + label {      background-image: none;      background-color:#ebe300;  	color:#454545;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    <div class="wrapper">  	<input type="radio" id="radio1" name="radios" value="sml">         <span>small</span>  	<input type="radio" id="radio2" name="radios" value="med">         <span>meduim</span>  	<input type="radio" id="radio3" name="radios" value="lrg">         <span>large</span>  </div>

just change js to

  $( document ).ready(function() {     jquery.each($(".wrapper span"), function() {     var input_id = $(this).prev().attr("id");     $(this).replacewith("<label for='"+input_id+"'>" + $(this).text() + "</label>");     });   }); 

which id of previous node , add label "for" attribute