2022.2

query("#salesrep").after("<p>Lorem ipsum</p>").css("color","red");

Matched element Matched element after script execution
<pid="salesrep">PeterParker</p> <pid="salesrep"style="color:red;">PeterParker</p>
<p>Loremipsum</p>
Notethatthewaythefunctionsafter()andcss()areusedinthisscriptiscalled'chaining'.Chainingis
optional;thesamecouldbeachievedbystoringtheresultofthequeryinavariable:
var salesrep = query("#salesrep");
salesrep.after("<p>Lorem ipsum</p>");
salesrep.css("color","red");
Thefollowingscriptinsertsaparagraphaftertheelementsintheresults(thesetofHTMLelementsthat
matchtheselectorofthescript).
results.after("<p>Lorem Ipsum</p>");

Matched element Matched element after script execution
<pid="salesrep">PeterParker</p> <pid="salesrep">PeterParker</p>
<p>Loremipsum</p>
Thisscriptlooksforthestring"Lorem"intheresults(thesetofHTMLelementsthatmatchtheselector
ofthescript)andinsertsthestring"ipsum"rightafterthattext.Thestringisautomaticallyenclosedina
span.
results.find("Lorem ").after("ipsum");

Matched element Matched element after script execution
<p>Loremdolorsitamet,consecteturadipiscingelit.</p> <p>Lorem<span>ipsum</span>dolorsitamet,consecteturadipiscingelit.</p>
Page 1243