不从html代码中提取Div html代码

Question

java脚本代码

 $("#category select").change(function(){
 var category = $('select option:selected').html();

 $.ajax({
    type:"Post",
    url:"collectiepost.php",
    data:"category="+category,
    cache:"false",
    success:function(html){

 $("select").html($(html).find("option.category"));
 $("#test").html($(html).find("#testdata"));
    }
    });
  });
 }); 

collectiepost.php页面上的html输出

 <select id="ontwerper">
 <option class="desinger">vikas</option>
 </select>

 <select id="category">
 <option class="category">cloth1</option>
 <option class="category">cloth2</option>
 </select>

 <div id="testdata">test data</div>

需要输出

<select>
<option class="category">cloth1</option>
<option class="category">cloth2</option>
</select>

 <div id="test">
 <div id="testdata">test data</div>   
 </div>

问题

但是我的输出没有div标签

<select>
<option class="category">cloth1</option>
<option class="category">cloth2</option>
</select>

Answer 1

删除以下行中"div #test“中的空格：

$("div #test").html($(html).find("div #testdata"));

Answer 2

我想你可以得到这个：

<div id="test">
 <div id="testdata">test data</div>   
</div>

因为在html输出中没有"test“div：

<select id="ontwerper">
 <option class="desinger">vikas</option>
 </select>

 <select id="category">
 <option class="category">cloth1</option>
 <option class="category">cloth2</option>
 </select>

 <div id="testdata">test data</div>
No test div here

而$("div #test").html($(html).find("div #testdata"));失败了

把它包装成这样：

$('#testdata').wrap('<div id="test" />');