In Tritium, how do I transform all <p> tags to <div> tags?

Question

I’m working in the Moovweb SDK and am optimizing my personal desktop site for mobile.

How do I transform all my <p> tags to <div> tags? I really don't want to do it manually! Search and replace?? haha

Answer 1

You can use the name() function to change the name of an element. For example:

$("//p") {
    name("div") 
}

See it in action here: http://tester.tritium.io/bd1be4f2c187aed317351688e23f01127d26343a

Answer 2

Cheap way: Add p{margin:0} to your CSS, this will remove the only special styling of <p> tags making them look like <div>s.

This is only a visual effect, though. For instance, you're still not allowed to put a <form> inside a <p>, even with the above CSS. If that's what you're after, a simple search and replace will do:

• Replace <p> with <div>
• Replace <p␣ (left angle, p, space) with <div␣ (there's a space at the end of that one too)
• Replace </p> with </div>

That should do it!