Jquery - Select Dynamic Elements

// THIS JQUERY UPDATES MY UL BASED ON THE ID OF THE BUTTON CLICKED, THE FUNCTION BUILDBUTTONS IS AN AJAX REQUEST TO GET THE NEW HTML
 
		// Generate Buttons (Ajax) Add to Page & Set Active State
		$('ul.pages-icons a').click(function() { //start function when any link is clicked
				
			//var current = $(this).parent("li").find("b").attr("class"); //retrieve id of link so we can use in php file		
			var current = $(this).attr("class"); //retrieve id of link so we can use in php file		
			
			if (current != "active") 
			{
				
		 		var page_id = $(this).attr("id"); //retrieve id of link so we can use in php file		
												   
				//Select this element
				$("ul.pages-icons li a.active").fadeTo("fast", 0).attr('class','off');
				
				// Set current Item Active"page_id="+page_id
				//$("ul.pages-icons-large li#recordsArray_"+page_id).attr('class','active');
				$(this).attr('class','active');
				
					$(".tools-icons").fadeOut(750, function() {
							buildbuttons(page_id);
							
					});
						
			  } // End If
				 
         }); //close click
         
 
// THIS IS THE CODE I USE TO SELECT NEW ELEMENT I NEED TO SELECT i have also tried binding the function to that element
 
 
      $('ul.tools-icons li#offline').click(function () {
			$("#responce").html('Item Clicked');
        ); 
        
        
        
// THIS IS THE HTML LI BEFORE REPLACMENT WHICH I CAN SELECT
 
<div id="tools-outer">
    <div class="table">
        <ul class="tools-icons">
            <li class="offline edit-page"></li>
            <li class="offline page-settings"></li>
            <li class="offline view-sub-pages"></li>
            <li class="offline take-online"></li>
            <li class="offline delete-page"></li>
            <li><a title="" href="javascript:void(0);" class="add-new-page">Add new page</a></li>                    
        </ul>
    </div>
</div>
 
 
// THIS IS THE HTML LI AFTER REPLACMENT WHICH I CANNOT SELECT
 
<div id="tools-outer">
    <div class="table">
        <ul class="tools-icons">
        <li><a title="Edit selected page" href="#" class="edit-page">Edit selected page</a></li>
        <li><a title="Edit selected page settings" href="#" class="page-settings">Edit selected page settings</a></li>
        <li><a title="View sub pages" href="#" class="view-sub-pages">View sub pages</a></li>
        <li id="offline"><a title="Take selected page offline" href="#" class="take-offline" id="8">Take selected page offline</a></li>
        <li id="delete"><a title="Delete selected page" href="#" class="delete-page">Delete selected page</a></li>
        <li><a title="Add new page" href="#" class="add-new-page">Add new page</a></li></ul>
    </div>
</div>

                                  

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68: