Hello there,
I’ve learning jQuery since short time and this is a training example where I have 2 buttons and a div
the 2 buttons; (one create paragraph and appends it to the div and the other buttons remove the last paragraph from the div).
the creation button has no problem. The problem in the hide button, instead of hiding the last paragraph in the div, it returns a problem in the nth-child (Uncaught Error: Syntax error, unrecognized expression: :nth-child)
I attached 2 images for the html and js codes
and also here is the written code if someone wants to copy
HTML Code:
<!DOCTYPE html>
<html>
<head>
<title>jQuery Training</title>
<link rel=”stylesheet” type=”text/css” href=”css/style.css”>
</head>
<body>
<button class=”btnCreate”>create</button>
<button class=”btnHide”>hide</button>
<div class=”parent”></div>
<script src=”js/jquery-3.3.1.min.js”></script>
<script src=”js/plugins.js”></script>
</body>
JS Code:
$(function(){
//create new paragraph
//*********************
$(‘.btnCreate’).on(‘click’,function(){
$(‘.parent’).append(‘<p class=”item”>this is new paragraph</p>’)
})
//hide last paragraph
//********************
$(‘.btnHide’).on(‘click’,function(){
var count_p = $(‘.item’).length – 1
$(“p:nth-child(count_p)”).fadeOut()
})
I hope the description is clear.
Thanks <3