jquery - 右クリックで HTML コードを取得する

Question

私は jQuery を使用しており、ユーザーが右クリックした要素の HTML コードを取得する必要があります。jsfiddle にはサンプルがあります。HTML コードに ID がありません

JSFiddleはこちら

<div id="container">
  <p>Click Area 1</p>
  <p>Click Area 2</p>
  <div>
     Click area 3<br/>
     <a href="#">Click Area 4</a><br/>
     <a href="#">Click Area 5</a><br/>
  </div><br/>
   <div id="codewidget" ></div><br/>
</div>

HTML コンテンツを取得して codewidget に出力するにはどうすればよいですか? 私は試しましたが、私はこれにちょっと慣れていません。

Answer 1

複数の問題がある

1. jsfiddle で jQuery ライブラリが選択されていませんでした
2. IDcode widgetにスペースを含めることはできません
3. $('#container').click(行方不明だった$

試す

<div id="container">
    <p>Click Area 1</p>
    <p>Click Area 2</p>
    <div>
        Click area 3<br/>
        <a href="#">Click Area 4</a><br/>
        <a href="#">Click Area 5</a><br/>
    </div><br/>
    <div id="codewidget" ></div><br/>
</div>

それから

$('#container').click(
    function(e){ 
        //prevent any click
        e.preventDefault();
        //get the id of the selector
        var s = e.target.outerHTML;
        $("#codewidget").text(s);
    }
);

デモ:フィドル

Answer 2

@arun P ジョニーのコード

以下のように変更すると、htmlが得られます

$('#container').click(
    function(e){ 
        //prevent any click
        e.preventDefault();
        //get the id of the selector
        var s = e.target.outerHTML;
        $("#codewidget").html(s); <!-- change it to html instead of text
    }
);