JS code-style chain structure

<div class= "box" >
<ul class= "Menu" >
<li class= "Level1" >
<a href= "#none" > Shirts </a>
<ul class= "Level2" >
<li><a href= "#none" > Short sleeve Shirts </a></li>
<li><a href= "#none" > Long-sleeved shirts </a></li>
<li><a href= "#none" > Short sleeve T blood </a></li>
<li><a href= "#none" > Long sleeves T-blood </a></li>
</ul>
</li>
<li class= "Level1" >
<a href= "#none" > Sweatshirt </a>
<ul class= "Level2" >
<li><a href= "#none" > Sweatshirt 1</a></li>
<li><a href= "#none" > Sweatshirt 2</a></li>
<li><a href= "#none" > Sweatshirt 3</a></li>
<li><a href= "#none" > Sweatshirt 4</a></li>
</ul>
</li>
<li class= "Level1" >
<a href= "#none" > Trousers </a>
<ul class= "Level2" >
<li><a href= "#none" > Pants 1</a></li>
<li><a href= "#none" > Pants 2</a></li>
<li><a href= "#none" > Pants 3</a></li>
<li><a href= "#none" > Pants 4</a></li>
</ul>
</li>
</ul>
</div>

<script>
$ (". Level1>a"). Click (function () {
$ (this). AddClass ("current")
. Next (). Show ()
. Parent (). siblings (). Children ("a"). Removeclass ("current")
. Next (). Hide ();
return false;
});
</script>

<!--
[Email protected]
Date: 2017-07-02
Description: (1) No more than 3 operations for the same object can be written in one line,
such as: $ ("Li"). Show (). Unbind ("click");
(2) For more operations on the same object, it is recommended that each line write a
such as: $ (this). Removeclass ("mouse")
. addclass ("Cat")
. Stop ()
. FadeTo ("Fast", 0.6)
. FadeTo ("Fast", 1)
. Unbind ("click")
. Click (function () {
To do
});
(3) A few operations on multiple objects, you can write one line per object, if there are child elements, you can indent
such as: $ (this). Removeclass ("mouse")
. addclass ("Cat")
. Childer ("Li"). Show (). End ()
. siblings (). Removeclass ("over")
. Childer (). Hide ();
-

JS code-style chain structure