Selects the specified first child element under the specified (p) parent element from the forward number (regardless of where the target element is located in the parent element):
Instance:
<! DOCTYPE html>;} Html{font:15px/1.2em ' Courier New '; color: #666;} div > *{margin:10px 0; cursor:pointer;} #demo {width:750px;margin:75px Auto;} button{padding:5px 15px;border:0;outline:none;margin-top:-5px;border-radius:2px;font:400 12px/1.2em ' Courier New ';} . active{background-color:yellow;transition:. 3s;} . Hover{background-color:red;transition:. 3s} p{text-indent:8px;}</style><script type= ' Text/javascript ' >/** Overview Select the specified first child element (p) from the back forward number under the parent element (regardless of where the target element is located in the parent element)*/ $(function(){ $(' P:nth-last-of-type (1) '). addclass (' active '); });</script>inchDiv.</li> <li>the First paragraphinchDiv.</li> <li>the First paragraphinchDiv.</li> <li>the First paragraphinchDiv.</li> <li>the First paragraphinchdiv.</li> </ul> <p class= ' test ' >the first paragraphinchdiv.</p> <div style= ' border:1px solid #3695BC ' > <p>the First paragraphinchdiv.</p> </div> <div style= ' border:1px solid #3695BC ' > <p>the first Parag RaphinchAnother div.2</p> <p>the last paragraphinchAnother div.2</p> </div> <div> <p>the First paragraphinchdiv.</p> </div> <div style= ' border:1px solid #3695BC ' > <span style= ' White-spa Ce:pre-wrap; ' > The first spaninchDiv.</span> <p>the First paragraphinchdiv.</p> <span style= ' white-space:pre-wrap; > The first spaninchDiv.</span> </div> </div></body>
[jquery selector: Nth-last-of-type ()] selects the specified first child element under the parent element (p) that specifies the forward number (regardless of where the target element is located in the parent element)