Wednesday, May 16, 2012

Select First Element by jQuery

This is My HTML Dom



<dd>
<div class="Addable Files">
<div style="margin:5px;">
<select name="Kind" id="kind">
<option value="1" >K1</option>
<option value="2" >K2</option>
<option value="3" >K3</option>
</select>

<div class="customfile">
<span aria-hidden="true" class="customfile-button button">Browse</span>
<input type="file" name="Files" class="fileupload customfile-input">
</div>
<select name="yap">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
</div>
<input type="button" value="new" style="margin-top:5px;" class="AddNewE button red" id="AddFiles">
</dd>


And my Script:



//Add new Addable div
$('.AddNewE').click(function () {


var Target = $('.Addable.Files:first');
var CloneTarget = $(Target).clone();
CloneTarget.insertAfter('.Addable.Files:last');

$('select').css('color', 'gray');
$(Target).find('select').each(function () {
$(this).css('color', 'red');

});
});


So I expect when I click add button just first two select (two select of first div) be Red and all other selects be gray, but I see weird behavior, In first Add everything is OK, but then in each Add all selects be red except second one, I think Target is first div and also I select Target's Select elements so why all selects be Red? where is my problem?





No comments:

Post a Comment