Patrick Star Patrick Star - 3 months ago 18
jQuery Question

jQuery move blocks element if class match

class won't be fixed so need to find same unique 2 class with div and ul and move div inside ul with wrap li. at last when all done then add new addclass on ul

check screenshot my current situation - https://drive.google.com/file/d/0B-aBOQ69HXqbWVhLTWhzWHFoQlE/view?usp=sharing

these menu exist on html





<div class="nav1">
<ul>
<li>menu a</li>
<li>menu a</li>
</ul>
</div>


<div class="nav2">
<ul>
<li>menu a</li>
<li>menu a</li>
</ul>
</div>





**these block will be add somewhere else**





<div class="nav1"><img src="img" /></div>

<div class="nav2"><img src="img" /></div>





Final output.





<div class="nav1 newfixedclass">
<ul>
<li>menu a</li>
<li>menu a</li>
<li><div class="nav1"><img src="img" /></div></li>
</ul>
</div>


<div class="nav2 newfixedclass">
<ul>
<li>menu a</li>
<li>menu a</li>
<li><div class="nav2"><img src="img" /></div></li>
</ul>
</div>







<nav class="navigation">
<ul>
<li class="nav-women">
<a class="level-top" href="women"><span>women</span></a>
<ul class="level0">
<li class="nav-features">
<a href="women/features"><span>FEATURES</span></a>
<ul class="level1">
<li class="nav-new-arrivals">
<a href="women/features/new-arrivals"><span>New Arrivals<span></a>
</li>
</ul>
</li>
<li class="nav-categories">
<a href="women/categories"><span>CATEGORIES</span></a>
<ul class="level1">
<li class="nav-sweaters">
<a href="#"><span>Sweaters</span></a>
</li>
</ul>
</li>
</ul>
</li>
<li class="nav-mens">
<a class="level-top" href="mens"><span>mens</span></a>
<ul class="level0">
<li class="nav-features">
<a href="mens/features"><span>FEATURES</span></a>
<ul class="level1 submenu sub0">
<li class="nav-new-arrivals">
<a href="mens/features/new-arrivals"><span>New Arrivals</span></a>
</li>
</ul>
</li>
<li class="nav-categories">
<a href="mens/categories"><span>CATEGORIES</span></a>
<ul class="level1">
<li class="nav-bags">
<a href="mens/categories/bags"><span>Bags</span></a>
</li>
<li class="nav-blazers">
<a href="mens/categories/blazers"><span>Blazers</span></a>
</li>
<li class="nav-ties">
<a href="mens/categories/ties"><span>Ties</span></a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>


<div class="nav-women"><img src="http://images.apple.com/v/home/ct/images/promos/public_betas_medium.jpg"></div>
<div class="nav-mens"><img src="http://images.apple.com/v/home/ct/images/promos/public_betas_medium.jpg"></div>




Answer

Here i have put your HTML as per my understanding and solution of your query in script.

<div class="nav1">
    <ul>
        <li>menu 11</li>
        <li>menu 22</li>
    </ul>
</div>


<div class="nav2">
    <ul>
        <li>menu 33</li>
        <li>menu 44</li>
    </ul>
</div>

<div class="nav1"><img src="~/Images/bullet.png" /></div>
<div class="nav2"><img src="~/Images/bullet.png" /></div>

<script>
    $(document).ready(function () {
        $("div[class^='nav'] img").each(function (a, b) {                
            var imgTag = $(this).closest("div[class^='nav']").clone(true);
            var parentDivClass = imgTag.attr("class");
            $(this).closest("div[class^='nav']").remove();

            var newHtml = "<li>" + imgTag[0].outerHTML + "</li>";
            $("div[class^=" + parentDivClass + "] ul:first").append(newHtml);
            $("div[class^=" + parentDivClass + "]:first").addClass("newfixedclass");
        }); 
    });
</script>