SO 16577864 - sticker removal

by Gerald Gillespie

HTML

<div id="mainForSticks"></div>        
<input value="click for new sticker"/>

CSS

.sticker { border-style:outset;
border-width:5px;
    background-color : yellow;
}

JavaScript

stickerId = 1;
function createSticker(jsonNewSticker){     // receives json

str ="<b>Email:</b> "+ jsonNewSticker.email+ 
"</br> <b>Title:</b> "+ jsonNewSticker.title+
"</br> <b>Summary:</b> "+ jsonNewSticker.summary+
"</br> <b>Description:</b> "+ jsonNewSticker.description +
"</br> <b>Entry expires: </b>" + jsonNewSticker.expiration_date;

    $("#mainForSticks").prepend("<div id= seq-"+ stickerId +" style='background-color : "+pastels[stickerId]+"'></div>");
$("#seq-"+ stickerId).attr("class","sticker");      
$("#seq-"+ stickerId).html(str);

$("#seq-"+ stickerId).append("<div id=report><a class=link href=javascript:reportCounter()>Report</a></div>"); // report  
$("#report").attr("class","reportText");

$("#seq-"+ stickerId).append("<div id=deleteSticker><a class=link href='#'><b>X</b></a></div>"); // delete 
$("#deleteSticker").attr("class","delSticker");
//currentId = $(this).attr('id');
stickerId++;

}


var myJSON = { "email" : "[email protected]",
              "title" : "Mr.",
              "summary" : "he rocks",
              "description" : "trust me",
              "expiration_date" : "tomorrow"};

var pastels = ['yellow','pink','lime','cyan','orange'];

var deleteSticker = function(){
   var sticker = $(this).closest('[id^="seq"]');
        alert("your sticker ID is: "+sticker.attr('id'));
    sticker.remove();
    
    return false;
}

$('#mainForSticks').on('click', 'a', deleteSticker);

$('input:last').on('click', function(){
    createSticker(myJSON);
});