jquery - 各ループ変数を背景画像に入れ、キーを隠しますか?

Question

これに対する答えはおそらく非常に単純なので、私に気をつけてください。私は先月jQueryを始めたばかりです。

ループをまとめてeachスライダー内の画像を移動し、それらをキーにhref'ingします。コードは次のようになります。

var images = [{key:'1', img:'photo1.jpg'},{key:'2', img:'photo2.jpg'},
    {key:'3', img:'photo3.jpg'},{key:'4', img:'photo4.jpg'}]; 

var buttons = $("<~ul id='index_buttons' />");
$.each(images, function(imgIndex, imgData) {
    $(buttons).append($("<~li><~a href='" + imgData.img + "'>" + imgData.key + "<~/a><~/li>"));

問題は、それが生成するスライダーの上にメニューを配置したいということです。これは、すべての画像を styled に変更することで実行できます"background-image:"。だから私は試しました：

$(buttons).append($("<~li><~a style=\"background-image:" +  imgData.img 
  + "\"href='"  + imgData.key + "'>""<~/a><~/li>"));

ほとんど成功しません。

これと同様に、ボタンはリンクを作成するためにキーに依存しています。画像のキーを置き換えましたが、リンクを壊さずにキーを非表示/削除するにはどうすればよいですか?

ありがとう ：）