We Keep Coding

How to find the Div elements along with the input elements through jquery selector string

The queryString to find all the input elements with ID ends with '-0', '-1' etc ..
the below code works fine
var queryString = ':input:focusable[id$="-' + index + '"]';
I also want to find the div elements ending with the same scenario .. How i can change the query ??

You can use comma to add additional selectors:
var queryString = ':input:focusable[id$="-' + index + '"],div[id$="-' + index + '"]';

make it
var queryString = ':input:focusable[id$="-' + index + '"], div[id$="-' + index + '"]';
Using comma , you can add selectors to the same query string.
Edit
but the select element am having present inside the div element and
the div element has the ID
try this
var queryString = 'div[id$="-' + index + '"]:input:focusable';

How do i make jQuery unique ID for div for click event?

I need on selection to append div element to the another div, I have done it, and also every time when I select new selection, it should append new div.
the problem is, those appended div's have same id, so I can not delete particular element. I have made them unique with declaring var and combining id with a string, like : id="add_marke'+selectedKey+'" BUT I cant do something like this jQuery( "#add_marke'+selectedKey+'" ).click(function() {
How can I select ID when I make unique ID?
var selectedKey = jQuery("#model").val();
jQuery('#example').append('' + '<div class="add_marke" id="add_marke' +
selectedKey + '" >' +
' <div class="car_tag"><span class="lbl"><span id="car_name" class="icon-remove"></span></div> ' +
'&nbsp' +
' <select name="model_cars" id="model_cars" ><option id="selectModel" name="selectModel" value="all" >Please select </option><option>test</option></select>' +
'&nbsp' + '</div>');
jQuery("#car_name").click(function() {
jQuery("#add_marke\\.selectedKey").remove();
});

You can add the IDs as you do with a predefined prefix:
... id="add_marke_' + selectedKey + '" ...
And then bind the click with a jQuery selector for all elements that have the ID starting with add_marke_:
$('div[id^="add_marke_"]').click()

What you need to do is add the click handler to the class name shared by all of these divs. Once the click handler has been triggered, you can then extract the relevant id of the element and compose a selector from that id.
jQuery( ".class_name" ).click(function() {
var id = jQuery( this ).attr( "id" );
jQuery( "#" + id ).remove();
});

You can use
jQuery( ".icon-remove" ).click(function() {
jQuery(this).parent().parent().parent().remove();
});

Since an ID must be unique you have one of two options, as I see it:
Appending some sort of counter or numeric identifier to the ID, so you always have a unique ID (e.g., count the number of elements and then attribute your ID as my-id-1, my-id-2, etc.) Here you would have to write the DOM query in such a way that searches only for those IDs which begin with a given pattern, div[id^="my-id-"]
Use a class to identify the object in terms of any interactions you would like to provide for all of these <div> elements which have the same structure. Here, you can query based on a common class, in your case .add_marke.

<div class="parentElement">
<span>jagadeesh</span>
<span class="icon-remove car-remove"></span>
<button >Remove</button>
</div>
$('.car-remove').on('click',function(){
var mainElement = $(this).closest('.parentElement')
/// do what ever you want with main element. it selects only current parent
//element
mainElement.remove();
})

Did you want to do something like this?
http://jsfiddle.net/Wg9FE/1/
var selectedKey = "someId";
jQuery('#example').append('' +
'<div class="add_marke" id="add_marke'+selectedKey+'" >' +
' <div class="car_tag"><span class="lbl"><div id="car_name" class="icon-remove"></div></div> ' + '&nbsp' +
' <select name="model_cars" id="model_cars" ><option id="selectModel" name="selectModel" value="all" >Please select </option><option>test</option></select>'+ '&nbsp' +
'</div>');
jQuery( "#car_name" ).click(function() {
jQuery( "#add_marke" + selectedKey ).remove();
});

how to append the data using jquery?

I need to add the value into the span using dom. But now i am using string manipulation. how to change this into the dom or append the value . i need to get the return value in html formate using dom.

Define layer.id as some text and this will get replace in all span element content
$.each($("span"),function(){
$(this).html(layer.id);
});
Thanks

You can append like following :
$('.ClassName').append('<p>Test</p>');

$('#id').after('<p>Test</p>');
$('#id').before('<p>Test</p>');

Try with this:
$("<li class='" + liClass + "'>" + preElement +
"<label for='" + layer.id + "'>" + layer.name + "</label>").appendTo('ul.class');
//----------^^^^^
// use the id
// or class of
//the specific ul
use appendTo() instead return and append it to your element.
(as i see you are returning li then append it to the ul)

Span doesn't get updated within div

Hello I'm trying to update div span text from ajax call, here is my html structure :
<div id="23" class="message product error">
<strong>
<br>
<strong>Unique id Id:</strong>
<span class="uniqueId" style="color: #000; font-weight: bold;">job_201208311928_78749</span>
<br>
<strong>Job Status:</strong>
<span class="status" style="color: #000; font-weight: bold;">IN PROGRESS</span>
</div>
I'm trying to update status IN PROGRESS to SHIPPED
But my jquery fails to do it :
function update (item){
$('#' + item.id + "span.status").text(item.CurrentStatus);
}
Item.id and item.CurrentStatus both have right values when I alert.

You need to include a space before your span:
function update (item){
$('#' + item.id + " span.status").text(item.CurrentStatus);
}

Gotta insert a space there.
$('#' + item.id + ' span.status').text(item.CurrentStatus);
Or to make it even clearer:
$('#' + item.id).find('span.status').text(item.CurrentStatus);

I believe that you need a space in your selector:
function update (item){
$('#' + item.id + " span.status").text(item.CurrentStatus);
}

I think you missed a space in selector
Try this
$('#' + item.id + " .status").text(item.CurrentStatus);

As already pointed out, you need to insert a space. This space indicates, that the <span> element with the class status is a descendant of the element with the given id.
Without the space, you're saying give me the element with the id <id>span (e.g. 23span) with the class status.
function update (item){
$('#' + item.id + " span.status").text(item.CurrentStatus);
}

How to access an element that is placed next to it?

I have following html structure:
<span class="thump">1</span>
<a class="tp" href="#" programm="5">Post</a>
Now I want to write thump according to programm attribute. This is how I get the the a element according to the programm number:
$("a.tp[programm='" + programm + "']");
How do I refer to the thump element that is next to this a element?

var anchor = $("a.tp[programm='" + programm + "']");
var thump = anchor.prev();
Or if there is only one thump element (previous is recommended, especially if they are adjacent elements):
var anchor = $("a.tp[programm='" + programm + "']");
var thump = anchor.siblings('.thump');