CODEWITHSUNDEEP
jquery
ShaneKm
ShaneKm

Reputation: 21368

JQuery find closest to sibling div

for the following:

                    <div class="section">
                        <div class="row infoOn">
                            <div class="itemWrap clearfix">
                                <div class="itemTop clearfix">
                                </div>
                                <label class="">File title:</label>
                                <div class="inputWrap clearfix">
                                    <input type="text" class="text inpButton" value="upload file first" disabled="true"/>
                                    <a id="fileUpload" href="#" class="button">Browse</a>
                                </div>
                            </div>
                        </div>

                        <!-- filelist -->
                        <div class="row uploadList">
                            <div class="itemWrap clearfix">
                                <label>&nbsp;</label>
                                <div class="inputWrap clearfix" style="position:relative;">
                                    <ul>
                                        <li><span class="qq-upload-file">companyPic.png</span><span class="qq-upload-spinner"></span><span class="qq-upload-size" style="display: none;"></span><a href="#" class="qq-upload-cancel">Cancel</a><span class="qq-upload-failed-text">Failed</span></li>
                                        <li><span class="qq-upload-file">companyPic.png</span><span class="qq-upload-spinner"></span><span class="qq-upload-size" style="display: none;"></span><a href="#" class="qq-upload-cancel">Cancel</a><span class="qq-upload-failed-text">Failed</span></li>
                                        <li><span class="qq-upload-file">untitled.bmp</span><span class="qq-upload-spinner"></span><span class="qq-upload-size" style="display: none;"></span><a href="#" class="qq-upload-cancel">Cancel</a><span class="qq-upload-failed-text">Failed</span></li>
                                        <li><span class="qq-upload-file">This i...Document.docx</span><span class="qq-upload-spinner"></span><span class="qq-upload-size" style="display: none;"></span><a href="#" class="qq-upload-cancel">Cancel</a><span class="qq-upload-failed-text">Failed</span></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <!-- // file list -->
</div>

how do i select 'ul' element in "div.uploadlist" in relation to 

    var button = $('#fileUpload')[0];
    alert($(button).closest('div.row').find('.uploadList ul').html());

??

Upvotes: 5

Views: 16204

Answers (3)

Sjoerd
Sjoerd

Reputation: 75689

Wrap the corresponding infoOn and uploadList in their own div. In your example that may be div.section. Then, find the div.section parent of the div.infoOn and find the uploadList within that parent.

Upvotes: 0

rahul
rahul

Reputation: 187110

var button = $('#fileUpload');
alert(button.closest('div.row').next("div.uploadList ul").html());

You don't have to get the HTML object and then wrap again it to jQUery object.

Upvotes: 2

ThiefMaster
ThiefMaster

Reputation: 318808

You could use e.g. $(button).closest('div.row').next('.uploadList').find('ul')

Upvotes: 8

Related Questions