| 
									
										
										
										
											2018-10-12 15:37:13 -04:00
										 |  |  | --- | 
					
						
							|  |  |  | title: Target the Parent of an Element Using jQuery | 
					
						
							|  |  |  | --- | 
					
						
							|  |  |  | ## Target the Parent of an Element Using jQuery
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | ## Solution
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-03-02 02:03:52 +05:30
										 |  |  | ```html | 
					
						
							| 
									
										
										
										
											2018-10-12 15:37:13 -04:00
										 |  |  | <script> | 
					
						
							|  |  |  |   $(document).ready(function() { | 
					
						
							| 
									
										
										
										
											2019-03-09 03:34:01 +05:30
										 |  |  |     $("#target1").css("color", "red"); | 
					
						
							|  |  |  |     $("#target1").prop("disabled", true); | 
					
						
							|  |  |  |     $("#target4").remove(); | 
					
						
							|  |  |  |     $("#target2").appendTo("#right-well"); | 
					
						
							|  |  |  |     $("#target5").clone().appendTo("#left-well"); | 
					
						
							|  |  |  |     $("#target1").parent().css("background-color", "red"); | 
					
						
							| 
									
										
										
										
											2018-10-12 15:37:13 -04:00
										 |  |  |   }); | 
					
						
							|  |  |  | </script> | 
					
						
							| 
									
										
										
										
											2019-03-09 03:34:01 +05:30
										 |  |  | 
 | 
					
						
							|  |  |  | <body> | 
					
						
							|  |  |  |   <div class="container-fluid"> | 
					
						
							|  |  |  |     <h3 class="text-primary text-center">jQuery Playground</h3> | 
					
						
							|  |  |  |     <div class="row"> | 
					
						
							|  |  |  |       <div class="col-xs-6"> | 
					
						
							|  |  |  |         <h4>#left-well</h4> | 
					
						
							|  |  |  |         <div class="well" id="left-well"> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target1">#target1</button> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target2">#target2</button> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target3">#target3</button> | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |       <div class="col-xs-6"> | 
					
						
							|  |  |  |         <h4>#right-well</h4> | 
					
						
							|  |  |  |         <div class="well" id="right-well"> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target4">#target4</button> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target5">#target5</button> | 
					
						
							|  |  |  |           <button class="btn btn-default target" id="target6">#target6</button> | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  |   </div> | 
					
						
							|  |  |  | </body> | 
					
						
							|  |  |  | ``` |