--- id: bad87fee1348bd9aede08817 title: Nest an Anchor Element within a Paragraph challengeType: 0 forumTopicId: 18244 dashedName: nest-an-anchor-element-within-a-paragraph --- # --description-- You can nest links within other text elements. ```html

Here's a link to www.freecodecamp.org for you to follow.

``` Let's break down the example. Normal text is wrapped in the `p` element: ```html

Here's a ... for you to follow.

``` Next is the *anchor* element `` (which requires a closing tag ``): ```html ... ``` `target` is an anchor tag attribute that specifies where to open the link. The value `_blank` specifies to open the link in a new tab. The `href` is an anchor tag attribute that contains the URL address of the link: ```html ... ``` The text, `link to www.freecodecamp.org`, within the `a` element is called anchor text, and will display the link to click: ```html link to freecodecamp.org ``` The final output of the example will look like this: Here's a link to www.freecodecamp.org for you to follow. # --instructions-- Nest the existing `a` element within a new `p` element. Do not create a new anchor tag. The new paragraph should have text that says `View more cat photos`, where `cat photos` is a link, and the rest is plain text. # --hints-- You should only have one `a` element. ```js assert( $('a').length === 1 ); ``` The `a` element should link to "`https://www.freecatphotoapp.com`". ```js assert( $('a[href="https://www.freecatphotoapp.com"]').length === 1 ); ``` Your `a` element should have the anchor text of `cat photos` ```js assert( $('a') .text() .match(/cat\sphotos/gi) ); ``` You should create a new `p` element. There should be at least 3 total `p` tags in your HTML code. ```js assert($('p') && $('p').length > 2); ``` Your `a` element should be nested within your new `p` element. ```js assert( $('a[href="https://www.freecatphotoapp.com"]').parent().is('p') ); ``` Your `p` element should have the text `View more ` (with a space after it). ```js assert( $('a[href="https://www.freecatphotoapp.com"]') .parent() .text() .match(/View\smore\s/gi) ); ``` Your `a` element should not have the text `View more`. ```js assert( !$('a') .text() .match(/View\smore/gi) ); ``` Each of your `p` elements should have a closing tag. ```js assert( code.match(/<\/p>/g) && code.match(/

/g).length === code.match(/

/g) && code.match(//g).length === code.match(/CatPhotoApp

cat photos A cute orange cat lying on its back.

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

``` # --solutions-- ```html

CatPhotoApp

View more cat photos

A cute orange cat lying on its back.

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

```