jquery - How can I set the id of certain DIVs to be the same as repective parent DIVs? -

i have 2 posts on blog. markup of posts follows (stripped down bit):

<div class="post audio" id="post_27">     <div class="subpost">         <div class="jp-jplayer">             <!-- other unimportant code -->         </div>     </div> </div> <div class="post audio" id="post_26">     <div class="subpost">         <div class="jp-jplayer">             <!-- other unimportant code -->         </div>     </div> </div> 

and jquery:

$(document).ready(function(){     var post_id = $(".jp-player").parents(".audio").attr("id");     $(".jp-jplayer").attr("id", "jp_" + post_id);      $("#jp_" + post_id).jplayer({         ready: function (event) {             $(this).jplayer("setmedia", {                 m4a: "media link..."             });         },         swfpath: "/feathers/audio/jplayer",         supplied: "m4a",         cssselectorancestor: "#jp_container_" + post_id,         wmode: "window",         smoothplaybar: true,         keyenabled: true     }); }); 

i want know how can use jquery set ids of jp-jplayer divs same respective audio parents. has been bothering me hours appreciated!

you can -

$(".jp-player").prop('id',function(){   return "jp_" + $(this).closest('.audio').prop('id'); })