jQuery sibilings help

jsFiddle

Okay the link above is a jsfiddle of what i cant figure out, when the #call div is clicked it is supposed to grab the .html() of its sibling #number and put that开发者_开发技巧 in the textbox. but it only works for the first contact div. I have no idea why its not working.

ids should be unique in the whole document. In your case, I guess, only the last defined elements are "visible".

You can't have multiple divs with same id

Fixed version http://jsfiddle.net/vEGBL/5/

You cannot use a duplicate ID. Change to:

<div class="contact">
    <div class="name">John</div>
    <div class="number">2143650034</div>
    <div class="call"></div>
</div>
<div class="contact">
    <div class="name">Terry</div>
    <div class="number">4690048824</div>
    <div class="call"></div>
</div>

$(".call").click(function() {
    var num = $(this).siblings(".number").html();
    $("#num").val(num);
});