Adding unique id or number to end of id for jQuery

问题:

I have everything working in html and jquery but what I need to do is assign and append a number to make the unique id work with the Repeater field. Here is what I have when it comes the HTML CSS and jquery. Is there a way to append a unique number (such as 1 or 2...) to the end of the #expand id in the html, with jQuery?

Here is the code I have with the help from you guys here:

    #expand-1 .bio-pic2, #expand-2 .bio-pic2 {
    position:absolute;
    top:0;
    left:0;
}
#expand-1, #expand-2 {
    position:absolute;
    width:1000px;
    border: 1px solid black;
    display: none;
    background-color:#ffffff;
    z-index:9999;
   height:323px;
}
.bio-pic2 img {
    position:absolute;
    top:0;
    left:0;
    width:323px;
}
.testimonial {
    position:absolute;
    top:333px;
    left:0;
    font-size:15px;
}
.desc {
    position:absolute;
    top:10px;
    left:333px;
}
.bio-pic {
    float:left;
    cursor: pointer;
    z-index:9998;
    margin:0 5px 0 0;
}
<div id="expand-1">
    <div class="test">
        <div class="bio-pic2">
            <img src="http://www.brent-ransom.com/photo-img.jpg" />
            <div class="bio-nt">
                    <h2>Name</h2>

                    <h3>Position</h3>

            </div>
        </div>
        <div class="testimonial">A testimonial!</div>
    </div>
    <div class="desc">This is a paragraph of text.</div>
</div>
<div id="img-1" class="bio-pic">
    <img src="http://www.brent-ransom.com/photo-img.jpg" />
</div>
<div id="expand-2">
    <div class="test">
        <div class="bio-pic2">
            <img src="http://brent-ransom.com/photo2-img.jpg" />
            <div class="bio-nt">
                    <h2>Name</h2>

                    <h3>Position</h3>

            </div>
        </div>
        <div class="testimonial">A testimonial!</div>
    </div>
    <div class="desc">This is a paragraph of text.</div>
</div>
<div id="img-2" class="bio-pic">
    <img src="http://brent-ransom.com/photo2-img.jpg" />
</div>
$(".bio-pic").click(function (e) {
    e.stopPropagation();
    //$('.bio-pic2').toggle("slow");
    var menu = $("#expand-"+$(this).attr("id").split("-")[1]);
    $(menu).show().animate({
        width: 500
    }, 1000);
});
$("#expand-1, #expand-2").click(function () {
    $(this).animate({
        width: 0
    }, 1000, function () {
        $(this).hide();
    });
})

Here is a link to jsfiddle http://jsfiddle.net/BrentRansom/h64CZ/4/

回答1:

to change an id...

var myNum = 3;
$('#expand').attr('id', 'expand' + myNum);