how to get the value of inner div in javascript

Question

I want to access the inner div and get it's value using Javascript. Would you please help me, I want to get the value of "phone" and insert it into a "list". I don't how to loop in all the DIVS and get only the checked one's below my setup:

<div class="headings_01">
<div class="checkbox_01"><input name="contact_id" id="selectedcontacts" type="checkbox" value="175" style="margin-top:0px;" /></div>
<div class="firstname_01" name="fname">|175|James</div>
<div class="lastname_01" name="lname">James</div>
<div class="group_01">G1</div>
<div class="mobile_nmbr_01" name="phone" id="phone">123456478</div>
</div>

I have tried this and did not success:

function AddContactPhoneNo()
{   
    var recipientNumber = document.getElementById("phone");
    var opt = "<option value='" + recipientNumber.value + "'>" + recipientNumber.value + "</option>"

    if  (recipientNumber.value != "")
    {
         $('#selectedOptions').append(opt);

            recipientNumber.value = "";

    }       
} 

Answer 1

I think i'm late responser about the udate of my answer but i'm sure if you find even now the solution then it will help you much. You should change your HTML first then write the jQuery code as like following block of code.

HTML

<div class="headings_01">
   <div class="checkbox_01">
     <input name="contact_id[]" type="checkbox" value="175" style="margin-top:0px;" />
   </div>
   <div class="firstname_01" name="fname">|175|James</div>
   <div class="lastname_01" name="lname">James</div>
   <div class="group_01">G1</div>
   <div class="mobile_nmbr_01">+8801711240984</div>
</div>

jQuery

function AddContactPhoneNo()
{ 
    $("input[name='contact_id[]']:checked").each(function(){

        var opt_value = $(this).parent().parent().children('.mobile_nmbr_01').text();
        var opt = "<option value='" + opt_value + "'>" + opt_value + "</option>";

        if  (opt_value != "")
        {
             $('#selectedOptions').append(opt);
        }
    });
}

Thats all. Very simple.

Answer 2

If you have a number of such repeating phone divs

set a counter value

var counter = 0;
var phoneDiv = "phone" + counter;

var a = document.getElementById(phoneDiv).innerHTML

counter++;