Matching Variables of Two Elements (binding cycle and ui-selectable)

Matching Variables of Two Elements (binding cycle and ui-selectable)

I need help with condensing my script so that a #div_x is related to a separate element img_x.

My project uses ui-selectable to grab points on a map and return an image set in a separate div via jquery cycle (as in here http://bit.ly/gH7Lm3).

I have bound the 'selectablestop' event to two functions - .hasClass and .append - in order to 1) detect if a point has been selected and 2) append the containing cycle div with a corresponding image (also, incidentally, contained within its own div). As is, it looks something like this:

  1. $("#selectable").selectable().bind("selectablestop", function(event, ui) {
    if($('#point_a').hasClass('ui-selected')){
    $('#cycle').append('<div id="pic"><img src="image_a.jpg" /></div>');}

    if($('#point_b').hasClass('ui-selected')){
    $('#cycle').append('<div id="pic"><img src="image_b.jpg" /></div>');}

    if($('#point_c').hasClass('ui-selected')){
    $('#cycle').append('<div id="pic"><img src="image_c.jpg" /></div>');}









, etc.

My question:

Can I accomplish this with one argument, using a variable x instead of writing out each line matching point_a to img_a, point_b to img_b, etc. That is,

  1. if($('#point_(variable)').hasClass('ui-selected')){
    $('#cycle').append('<div id="pic"><img src="image_(matching variable).jpg" /></div>');}



Thanks!