SOURCE

var xml =  "<procedure>\n" +
    "    <mainProcedure>\n" +
    "        <proceduralStep>\n" +
    "            <title>工艺流程</title>\n" +
    "            <para>\n" +
    "                <randomlist>\n" +
    "                    <listitem>\n" +
    "                        <para />\n" +
    "                    </listitem>\n" +
    "                </randomlist>\n" +
    "            </para>\n" +
    "        </proceduralStep>\n" +
    "        <proceduralStep>\n" +
    "            <title>施工工艺要求</title>\n" +
    "            <proceduralstep>\n" +
    "                <title>标题</title>\n" +
    "                <para />\n" +
       "            <proceduralstep>\n" +
    "                <title>标题</title>\n" +
    "                <para />\n" +
    "            </proceduralstep>\n" +
    "            </proceduralstep>\n" +
    "        </proceduralStep>\n" +
    "        <proceduralStep>\n" +
    "            <title>人员资格</title>\n" +
    "            <para />\n" +
    "        </proceduralStep>\n" +
    "    </mainProcedure>\n" +
    "</procedure>"
var mainProcedure = $(xml).children("mainProcedure");
var proceduralstep = $(mainProcedure).children("proceduralstep");

var li = ""
var par_0001 = $(proceduralstep[0]).find("listitem para")
for(var i=0;i<par_0001.length;i++){
    li="<li>"+$(par_0001)[i].innerHTML+"</li>"
}
$("#par-0001").html(li)


var par_0002 = $(proceduralstep[1]).find("proceduralstep")
$("#par-0002").html(proceduralstep[1].innerHTML)
console.log(proceduralstep[1].innerHTML)
for(var i=0;i<par_0001.length;i++){
    htmls="<div class=\"reset\">"+$(par_0002)[i].innerHTML+"</div>"
    $("#par-0002").html(htmls)
}
var par_0002_title = $("#par-0002").find("title")
for(var i=0;i<par_0002_title.length;i++){
    htmls="<h3 class=\"h3item\">"+$(par_0002_title)[i].innerHTML+"</h3>"
    $($(par_0002_title)[i]).replaceWith(htmls)
}
var par_0002_para = $("#par-0002").find("para")
for(var i=0;i<par_0002_para.length;i++){
    htmls="<div class=\"item\">"+$(par_0002_para)[i].innerHTML+"<br></div>"
    $($(par_0002_para)[i]).replaceWith(htmls)
}

var par_0003 = $(proceduralstep[2]).find("para");
var par_0003_html = par_0003[0].innerHTML+"<br>";
$("#par-0003").html(par_0003_html)

<div name="content1" id="content1" style="width:800px">
    	<div class="reset">
	<h3 class="h3item">工艺流程</h3>
		<ul id="par-0001">
		<li></li>
		</ul>
	<h3 class="h3item">施工工艺要求</h3>
	<div class="item" id="par-0002"><br></div>
	<h3 class="h3item">人员资格</h3>
	<div class="item" id="par-0003"><br></p>
	</div>
	</textarea>
</div>

.reset {
    line-height: 1.6;
    counter-reset: itemcounter;
    border: 1px dashed lightgray;
}

.item > .reset  {
    padding-left: 20px;
}



.h3item:before {
    content: counters(itemcounter,
    ".") ".";
    counter-increment: itemcounter;
}